jquery - 输入电子邮件后在 div 中显示 gravatar

Question

我想要做的是“用户完成输入他/​​她的电子邮件并移动到密码字段或刚刚完成输入电子邮件，让 jquery 根据插入的电子邮件加载用户 gravatar登录页面并将此图像加载到包含临时无图像图像的 div 中。”

我怎么能用 jQuery 做到这一点

Answer 1

没有给出 HTML

<input id="email" ... /><img id="gravatar" style="display:none;"/>

它不需要有人建议的 ajax，因为 gravatar 调用非常简单。

jQuery

$('#email').on('change', function(){
    var hash=md5($('#email').val()); // you will need to find a javascript md5 function
    $('#gravatar').attr('src', 'http://www.gravatar.com/avatar/' + hash).show();
});

我没有费心预加载图像。

“或者刚刚输入完电子邮件” - 如果你想这样做，你会抛出一个电子邮件地址验证功能并检查 keyup。

$('#email').on('keyup change', function(){
    if (is_email_address($(this).val()){
        var hash=md5($('#email').val()); // you will need to find a javascript md5 function
        $('#gravatar').attr('src', 'http://www.gravatar.com/avatar/' + hash).show();
    }
});