使用jQuery实时获取评论头像

昨天在泽泽那块看到了《使用AJAX实时获取评论头像》一文，感觉这种在主题里内嵌API的方式会浪费服务器性能，毕竟频繁访问API多多少少会对机器产生一些影响，故有此文

代码部分

$(document).ready(function(){
var getavatar = md5($("#mail").val());
$("#jq-avatar-replace").attr('src','https://gravatar.loli.net/avatar/'+ getavatar); 
});
$('#mail').bind('input propertychange', function() {
    var getavatar = md5($("#mail").val());
    $("#jq-avatar-replace").attr('src','https://gravatar.loli.net/avatar/'+ getavatar); 
});

说明：#mail为评论信息填写窗口内的邮箱部分，将填邮箱的<input>标签赋上id="mail"即可
#jq-avatar-replace为头像的实时显示，将要显示实时头像的<img>标签赋上id="jq-avatar-replace"即可
https://gravatar.loli.net/avatar/的头像源可按照实际需求进行更换
第一个function是考虑到非首次评论,第二个function是为了实现当输入框内容有变动时头像能跟着变
需要引用jquery和blueimp-md5这两个js文件，jq和这个库需要在上述代码运行之前加载

为啥登录用户无法显示

去Typecho的模板文件夹里找到comments.php,找到<?php if($this->user->hasLogin()): ?>这个东东,然后在他下面另起一行,写上<input id="mail" style="display:none" value="<?php $this->remember('mail'); ?>"/>即可
注：Typecho的邮箱信息是存在Cookie里的，此方法并不是暴露邮箱隐私的做法

主题里有pjax怎么办

本人的主题有pjax，刚才弄的时候忽视了这一点，故重新弄一遍代码，使用pjax方案的可以将上面的代码换成下面的新版代码，如果主题不是pjax(ajax)的可以随意

function avatar_replace_load(){
    var getavatar = md5($("#mail").val());
    $("#jq-avatar-replace").attr('src','https://gravatar.loli.net/avatar/'+ getavatar); 
}
$('#mail').bind('input propertychange', function() {avatar_replace_load();});
$(document).ready(function(){avatar_replace_load();});

重载代码有两条

avatar_replace_load();
$('#mail').bind('input propertychange', function() {avatar_replace_load();});

重载，即重新运行，故想办法让代码在换页面之后再运行一次就ok了