JavaScript的闭包的onkeyup与超时(JavaScript onKeyUp closur

我试着表格内分配onkeyup事件到所有输入，使用闭。 数组fields包含需要分配给他们的事件字段的所有名称。 阵列ajaxFields包含字段（从阵列的名称fields需要AJAX验证）。

function createEvents(fields,ajaxFields) {
    for(var x=0;x<fields.length;x++) {

        $('input[name='+fields[x]+']').keyup(function(field) { 
        //assign an onKeyUp event
            return function() {
                //some code using variable 'field' and array 'ajaxFields'
        }(fields[x]));
    }
}

我想用户已经在该领域完成录入之后要执行的onKeyUp函数第二，insted的每一个关键是时间（的onkeyup）。 这既节省了大量的处理空间，更何况Ajax调用。 使用此到目前为止IM：

clearTimeout(timer);
timer = setTimeout('validate()' ,1000);

您可能已经注意到，该功能validate()不存在，那是因为我不知道如何来包装关闭了一个名为函数里，和IM如果我应该甚至不知道...

那么，如何做呢？

编辑 ：这是当前小提琴

Answer 1:

你可以（也应该 ）通过功能setTimeout而不是字符串。

clearTimeout(timer);
timer = setTimeout(function(){
    // your code here
}, 1000);

所以，在你keyup ，尝试是这样的：

$('input[name='+fields[x]+']').keyup(function(field) { 
//assign an onKeyUp event
    return function() {
        var that = this,
            $this = $(this);
        clearTimeout($this.data('timeout'));
        $this.data('timeout', setTimeout(function(){
            //some code using variable 'field' and array 'ajaxFields'
            // "this" will not be your element in here, make sure to use "that" (or "$this")
        }, 1000));
    };
}(fields[x]));

我保存在超时$this.data ，让每一个元素都可以有自己的超时，而不是使用全局变量。

更新演示： http://jsfiddle.net/Z43Bq/3/

Answer 2:

这是你的代码应该是什么样子：

var timer;

$(document).ready(function() {
    var fields = $('.field');
    var ajaxFields = $('.ajax-field');

    createEvents(fields, ajaxFields);
});

function createEvents(fields,ajaxFields) {
    // Use jQuery's "foreach" method
    $(fields).each(function(inx, field) {
        // Bind the listener here
        $(field).keyup(function(ev) {
            // Clear timeout if necessary
            if (timer != null) clearTimeout(timer);

            // Set the timeout
            timer = setTimeout(function() {
                // Your code should here

                console.log('Fields: ', fields, '\nAjax Fields: ', ajaxFields, '\nTHE field: ', field);
            }, 1000);
        });
    });
}

还检出了工作代码的小提琴： http://jsfiddle.net/BLyhE/

文章来源: JavaScript onKeyUp closures with timeout