键盘计时器上的JQuery mailcheck

我使用这里找到的这个mailcheck代码：https://github.com/Kicksend/mailcheck如果你拼写错误，你会得到一个“建议”。键盘计时器上的JQuery mailcheck

我有一个输入电子邮箱和一个div，其中的建议文本将出现：

<form id="mailcheck-test"> 
    <label for="email">Email</label> 
    <input id="email" type="text"> 
</form> 
<div id="hint"></div>

我该如何申请一个KEYUP jQuery的定时器的输入框，然后让MAILCHECK激活？谢谢！

UPDATE

这是我更新的代码：变量$电子邮件= $（ '＃电子邮件'）; var $ hint = $（“＃hint”）; var typingTimer; //定时器标识符 var doneTypingInterval = 1000; //以ms为单位的时间，例如5秒

$('#email').keyup(function(){ 
    $hint.css('display', 'none').empty(); 
clearTimeout(typingTimer); 
$(this).mailcheck({ 
    suggested: function(element, suggestion) { 
    typingTimer = setTimeout(function(){  
       if(!$hint.html()) { 
     // First error - fill in/show entire hint element 
     var suggestion = "Yikes! Did you mean <span class='suggestion'>" + "<span class='address'>" + suggestion.address + "</span>" + "@<a href='#' class='domain'>" + suggestion.domain + "</a></span>?"; 
      $hint.html(suggestion).fadeIn(150); 
      } else { 
      // Subsequent errors 
     $(".address").html(suggestion.address); 
     $(".domain").html(suggestion.domain); 
      } 
      }, doneTypingInterval); 
     } 
    }); 
}); 

$hint.on('click', '.domain', function() { 
    // On click, fill in the field with the suggestion and remove the hint 
    $email.val($(".suggestion").text()); 
    $hint.fadeOut(200, function() { 
     $(this).empty(); 
    }); 
    return false; 
});

来源

2013-11-21 Dawn

好吧，我已经发布了我的代码。我以为我只是将mailcheck代码插入到keyup函数中。 – Dawn

这将是一个问题'如果（$（'＃email'）。val）'缺少'（）'为'val（）' – charlietfl

嗨charlietfi。我更新了我的代码。我得到它的工作，但我想增加一个延迟的功能。我仍然在研究如何让这个工作。 – Dawn

我终于搞定了！这里是一个工作演示：http://jsfiddle.net/dswizzles/jCWFe/1

var $email = $('#email'); 
var $hint = $("#hint"); 
var typingTimer;    //timer identifier 
var doneTypingInterval = 1000; //time in ms, 5 second for example 

$('#email').keyup(function(){ 
    $hint.css('display', 'none').empty(); 
clearTimeout(typingTimer); 
$(this).mailcheck({ 
    suggested: function(element, suggestion) { 
     if(!$hint.html()) { 
     // First error - fill in/show entire hint element 
     var suggestion = "Yikes! Did you mean <span class='suggestion'>" + "<span class='address'>" + suggestion.address + "</span>" + "@<a href='#' class='domain'>" + suggestion.domain + "</a></span>?"; 
     typingTimer = setTimeout(function(){     
      $hint.html(suggestion).fadeIn(150); 
     }, doneTypingInterval); 
     } else { 
     // Subsequent errors 
     $(".address").html(suggestion.address); 
     $(".domain").html(suggestion.domain); 
     } 
     } 
    }); 
}); 

$hint.on('click', '.domain', function() { 
    // On click, fill in the field with the suggestion and remove the hint 
    $email.val($(".suggestion").text()); 
    $hint.fadeOut(200, function() { 
     $(this).empty(); 
    }); 
    return false; 
});

来源

2013-11-22 23:01:16 Dawn

键盘计时器上的JQuery mailcheck

回答

相关问题