Question

$(".a").on("click",function(){
        $("b").stop(true, true).slideUp(500);
        $(this).next("c").stop(true, true).slideDown(500);
    });

我希望当用户点击“a”时，此行（第1行）只运行一次：

$("b").stop(true, true).slideUp(500);

但是这一行（第2行）无限运行：

$(this).next("c").stop(true, true).slideDown(500);

这意味着，当用户再次点击“a”时，第1行不会运行，而是第2行会运行。怎么样？我试试这个但不行：

$(".a").on("click",function(event){
            $("b").stop(true, true).slideUp(500);
            $(this).next("c").stop(true, true).slideDown(500);
            $(this).off( event );
        });

Answer 1

我建议使用one()来获得更清晰的代码并更好地传达其含义。

$(".a")
   .one("click", function () { alert("Only once!"); })
   .click(function () { alert("Always!"); });

Answer 2

当用户点击按钮时，您可以使用data设置标记：

$(".a").on("click",function(){
    if (!$(this).data('clicked')) {
        $("b").stop(true, true).slideUp(500);
        $(this).data('clicked', true);
    }
    $(this).next("c").stop(true, true).slideDown(500);
});

Answer 3

您可以使用类标记执行

$(".a").on("click",function(){
        if(!$(this).hasClass('clickedOnce')){
           $("b").stop(true, true).slideUp(500);
           $(this).addClass('clickedOnce');
        }
        $(this).next("c").stop(true, true).slideDown(500);
    });

运行一次事件的一部分并多次运行其他部分

3 个答案: