Question

我有一个使用jQuery .click事件的锚来启动一些函数。

jQuery(document).ready(function(){  
    jQuery('a.slide_circ').click(function(){ 
        do_all_functions();
        return false; 
    });
});

这是简短的代码.. 它按需运行，每次点击锚类slide_circ都会启动do_all_functions。

但我有一个问题。如果用户双击，他们运行2次或更多功能...... 想法怎么会下地狱。

我认为我需要禁用双击某种方式或在我的函数上设置超时，以便每次都不运行。任何人都可以帮助我吗？

Answer 1

使用.data方法将状态分配给元素。然后，使用setTimeout重置状态：

jQuery(document).ready(function() {
    jQuery('a.slide_circ').click(function() { 
        var $this = jQuery(this);
        if ($this.data('activated')) return false;  // Pending, return

        $this.data('activated', true);
        setTimeout(function() {
            $this.data('activated', false)
        }, 500); // Freeze for 500ms

        do_all_functions();
        return false; 
    });
});

Answer 2

有几种方法，但有一种方法是：

jQuery(document).ready(function(){ 
    var do_all_functions_running = false; 
    jQuery('a.slide_circ').click(function(){
        if (!do_all_functions_running) { 
            do_all_functions_running = true;
            do_all_functions();
            do_all_functions_running = false;
        }
        return false;   
    });  
});

不完美，但它会起作用。

Answer 3

您可以检查运行的最后日期，如果不到半秒，则取消：

jQuery(document).ready(function() {
    jQuery('a.slide_circ').each(function() {
        var lastRun = null;

        $(this).click(function() {
            if(lastRun && new Date() - lastRun < 500) {
                // Less than 500ms; ignore.
                return false;
            }

            // Set the last run:
            lastRun = new Date().getTime();

            // Continue:
            do_all_functions();
            return false; 
        });
    });
});

它具有更高效的优势。

如何使用jQuery禁用双击或超时点击？

3 个答案: