JQuery邮件检查键盘计时器

JQuery mailcheck on keyboard timer

本文关键字：键盘 计时器 检查 JQuery      更新时间：2023-09-26

我使用的是以下邮件检查代码：https://github.com/Kicksend/mailcheck如果你的电子邮件拼写错误，这会给你一个"建议"。

我有一个输入电子邮件框和一个div，其中会显示建议文本：

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

如何将keyup jQuery计时器应用于输入框，然后激活mailcheck？谢谢

更新

这是我更新的代码：var$email=$（'#email'）；var$hint=$（"#hint"）；var typeingTimer//定时器标识符var doneTypeingInterval=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;
});

我终于成功了！这是一个工作演示：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;
});
相关文章：