防止事件重复提交代码

var _timer = {};
function delay_till_last(id, fn, wait) {
    if (_timer[id]) {
        window.clearTimeout(_timer[id]);
        delete _timer[id];
    }

    return _timer[id] = window.setTimeout(function() {
        fn();
        delete _timer[id];
    }, wait);
}

////////////////////////////////////
$el.on('click', function() {
    delay_till_last('myclick', function() {
        // run something
    }, 500);
});
这个写法可以保证只有最后一次点击被触发,方法就是后一次事件会覆盖前一次事件,如果超过指定时间还没有新的事件,就执行最后一个事件

delay_till_last()这个函数是我在前端很常用的函数,用在用户可能密集输入的场合下,比如文本框持续输入,等到输入完毕再开始检查

$input.on('keypress', function() {
    // 用户停止输入300ms后开始检查
    delay_till_last('check_input', function() {
        // 检查文本框内容是否正确
    }, 300);
});

 

posted @ 2015-06-01 11:51  IT大鲨鱼  阅读(356)  评论(0编辑  收藏  举报
我的博客首页