用户停止键入时的Javascript操作

我有以下代码：

<input name="qty" id="qty" type="text" value="value"/>

<script>
var timer = null;
$('#qty').keydown(function(){
   clearTimeout(timer); 
param = Math.round(Math.random() * 100);
timer = setTimeout(function(){
    alert('a param : ' + param);        
}, 1000)
});
</script>

var定时器=null；
$（'#数量'）.keydown（函数（）{
清除超时（计时器）；
param=Math.round（Math.random（）*100）；
计时器=设置超时（函数（）{
警报（“a参数：”+参数）；
}, 1000)
});

这将在用户停止键入时创建并发出警报。这里有一个工作演示：

---

然而，我似乎无法让它在我这方面发挥作用。

虽然OP只是因为忘记了包含jQuery而找到了答案，但我想我会借此机会向大家介绍一个片段，让类似这样的事情更容易处理。（并不是说这真的很难）

下面的内容使

键入stopped->do action

问题像单个方法调用一样简单

/** debounce(callback, arguments, delay, object)
 *  Method to help reduce multifire issues 
 **/
;(function() {
function debounce(cb, args, delay, obj) {
    void 0 == obj && (obj = window);
    obj['__debounce_timer__'] && clearTimeout(obj['__debounce_timer__']);
    args = 'object' == typeof args ? Array.prototype.slice.call(args) : void 0 != args ? [args] : arguments;
    (0 > delay || "number" != typeof delay) && (delay = 250);   //  250 milliseconds as a default delay time
    return obj['__debounce_timer__'] = setTimeout(function() { delete obj['__debounce_timer__']; cb.apply(obj, args); }, delay);
}
window.hasOwnProperty("debounce") || (window.debounce = debounce);
})();

使用OP的Q的示例：

---

只是为了好玩，这里有一个扩展版本“小心以下版本将

debounce

添加到

函数

对象中

/** debounce(callback, arguments, delay, object)    ||  Function.debounce(arguments, delay, object)
 *  Method to help reduce multifire issues 
 **/
;(function() {
    function debounce(cb, args, delay, obj) {
        void 0 == obj && (obj = window);
        obj['__debounce_timer__'] && clearTimeout(obj['__debounce_timer__']);
        args = 'object' == typeof args ? Array.prototype.slice.call(args) : void 0 != args ? [args] : arguments;
        (0 > delay || "number" != typeof delay) && (delay = 250);   //  250 milliseconds as a default delay time
        return obj['__debounce_timer__'] = setTimeout(function() { delete obj['__debounce_timer__']; cb.apply(obj, args); }, delay);
    }
    window.hasOwnProperty("debounce") || (window.debounce = debounce);
    /** CAUTION APPENDS TO FUNCTION OBJECT **/
    function funcDebounce(args, delay, obj) { return debounce(this, args, delay, obj); }
    if (window.debounce === debounce) {
        Object['defineProperty'] && !Function.prototype.hasOwnProperty('funcDebounce')
            ? Object.defineProperty(Function.prototype, 'debounce', { value: funcDebounce })
                : Function.prototype.debounce = funcDebounce;
    }
})();

使用OP的Q的示例： 运行示例

函数回调（）{$（'#jon'）.removeClass（'typing'）.text（'FINISHED typing'）；}
$（'#bob'）。关于（'keyup'，函数（e）{
$（'jon'）.addClass（'typing'）.text（'typing…'）；
去盎司（回调）；
});
html，正文，表格{高度：100%；边距：0自动；文本对齐：居中；垂直对齐：中间；}
text区域{高度：8em；宽度：16em；}
.typing{背景色：#FCC；}



你能证明你已经包括了jQuery吗？此外，您的代码不在dom ready
$（function（）{}）中你能在你的代码中显示dom已经准备好了吗？如果你已经包含了JQuery，应该可以正常工作，你的代码没有问题。请发布您看到的控制台错误（开发者/Javascript控制台），我没有包括jQuery，谢谢您指出这一点。我一定是起得太晚了。谢谢
/** debounce(callback, arguments, delay, object)    ||  Function.debounce(arguments, delay, object)
 *  Method to help reduce multifire issues 
 **/
;(function() {
    function debounce(cb, args, delay, obj) {
        void 0 == obj && (obj = window);
        obj['__debounce_timer__'] && clearTimeout(obj['__debounce_timer__']);
        args = 'object' == typeof args ? Array.prototype.slice.call(args) : void 0 != args ? [args] : arguments;
        (0 > delay || "number" != typeof delay) && (delay = 250);   //  250 milliseconds as a default delay time
        return obj['__debounce_timer__'] = setTimeout(function() { delete obj['__debounce_timer__']; cb.apply(obj, args); }, delay);
    }
    window.hasOwnProperty("debounce") || (window.debounce = debounce);
    /** CAUTION APPENDS TO FUNCTION OBJECT **/
    function funcDebounce(args, delay, obj) { return debounce(this, args, delay, obj); }
    if (window.debounce === debounce) {
        Object['defineProperty'] && !Function.prototype.hasOwnProperty('funcDebounce')
            ? Object.defineProperty(Function.prototype, 'debounce', { value: funcDebounce })
                : Function.prototype.debounce = funcDebounce;
    }
})();

function opCallBack() {
    param = Math.round(Math.random() * 100);
    alert('a param : ' + param);
}

$('#qty').keydown(function(e){
    opCallBack.debounce(arguments, 1000, this);
});