Question

我有以下代码：

var wait = 500;
$(document).on("click",".new_game_list_row",function(event){
        var self = $(this);
        //As the element clicked on has it's data attributes defined
        //Retrieves it when the element is clicked on
        var id_quiz_list = self.data('quizlistId'),
            difficult = self.data('difficult');
            userid = $("#new_game_list_wrap").data('userid');
                setTimeout(function(){
                    $.post("new_game_add.php","userid="+userid+"&id_quiz_list="+id_quiz_list+"&difficult="+difficult,function(data){
                        $answer = data;
                        $("#new_game_list_wrap").fadeOut("slow",function(){
                            self.remove();
                            $("#quiz_list_wrap").append('<div class="quiz_list_row" data-quizlist-id="'+id_quiz_list+'" data-quizlevel-reached="0" '+
                            '><div class="inline list_cell" id="quiz_list_cell_rownew_id1">Quiz '+id_quiz_list+'</div><div '+
                            'class="inline list_cell" id="quiz_list_cell_rownew_id2">Current level: 1</div>');
                            showtrick(id_quiz_list,1);
                        }); 
                    }, "html");  
                }, wait);
    });

我正在尝试使用setTimeout()来避免对该行进行多次点击。我的桌子上到处都是幽灵。

我试过延迟但是没有用。

有什么想法吗？

Answer 1

乍一看，我没有看到在任何地方定义“等待”，这需要是毫秒整数值。除此之外，可能有更好的关闭方法，例如当一个click事件立即关闭绑定时，然后使用你的setTimeout在n毫秒内重新打开它。

您可以使用cookie或窗口变量来存储“isClickable”标志，并且只有在可点击时才执行您的逻辑。根据需要切换isClickable打开和关闭。也许在按钮上显示半透明的div以使其变灰并使其无法从鼠标上取下。

似乎没有充分的理由从dom中删除元素，然后稍后将其追回。长话短说，我看到超时的唯一问题是等待可能没有设置。 jQuery我认为你最好不要走另一条路，而不是实际操纵dom本身。（隐藏，重叠或只是停止处理点击）。

Answer 2

如果你想让click事件忽略x秒的任何动作，你可以这样写：

<强> HTML

<button>Click Me</button>

<强> JQuery的

$("button").click(function(){
    var $this = $(this);
    if(!$this.data("disabled")){
        alert("You clicked the button.  You won't be able to click it again for 5 seconds.");

        $this.data("disabled", true);
        setTimeout(function(){
            $this.data("disabled", false);
        }, 5000);
    }
});

Demo in jsfiddle

如果按钮的disabled数据设置为true，则只会跳过点击事件的内容。

如果不是disabled，它将运行其代码然后自行禁用。使用setTimeout，它可以在x秒内重新启用。

Answer 3

我解决了这个问题：

var isClickable=true, wait = 500;
$(document).on("click",".new_game_list_row",function(event){

    if(isClickable) {
        isClickable = false;
        var self = $(this);
        //As the element clicked on has it's data attributes defined
        //Retrieves it when the element is clicked on
        var id_quiz_list = self.data('quizlistId'),
            difficult = self.data('difficult');
            userid = $("#new_game_list_wrap").data('userid');
            $("#new_game_list_wrap").fadeOut("slow");
            $.post("new_game_add.php","userid="+userid+"&id_quiz_list="+id_quiz_list+"&difficult="+difficult,function(data){
                $answer = data;
                    self.remove();
                    $("#quiz_list_wrap").append('<div class="quiz_list_row" data-quizlist-id="'+id_quiz_list+'" data-quizlevel-reached="0" '+
                    '><div class="inline list_cell" id="quiz_list_cell_rownew_id1">Quiz '+id_quiz_list+'</div><div '+
                    'class="inline list_cell" id="quiz_list_cell_rownew_id2">Current level: 1</div>');
                    showtrick(id_quiz_list,1);
            }, "html"); 
                setTimeout(function(){
                    isClickable = true;
                }, wait);
    }
});

问题解决了。

SetTimeout和延迟不起作用

3 个答案: