Question

是的，我想要发生的是当按下按钮（或者在这种情况下，某些文本），Jquery显示包含图像的div标签，2秒后淡出图像然后显示一些文本。
这一切都很好用，但我只想让它工作一次我决定使用变量和if语句来执行此操作，因此变量从0更改为1，然后由于变量的更改而无法再次单击该按钮。
或者至少，这是措辞严厉的版本。

无论如何，这是我到目前为止所做的，但由于某种原因，在点击按钮后变量不会从0变为1，除此之外，它运行良好。

JS：

$(document).ready(function(){
    $("#text2").css("display","none");
    $("#ltt").css("display","none");
    var clicked = '0';
    if(clicked == 0) {
        $(".clicker").click(function() { 
            $("#ltt").fadeIn("slow");
            $('#ltt').delay(2000).fadeOut('slow');
            $("#text2").delay(3000).fadeIn(1000);
            $clicked = '1';
        });
    }
});

HTML：

<div class="clicker">
    click to see text
</div>
<div id="ltt">
    <img src="Images/LoadingCircle.gif" width="24" height="24">
</div>
<div id="text2">
    SOME TEXT
</div>

Answer 1

尝试在此上下文中使用.one()，

$(".clicker").one('click', function() { 
    $("#ltt").fadeIn("slow");
    $('#ltt').delay(2000).fadeOut('slow');
    $("#text2").delay(3000).fadeIn(1000);
});

Answer 2

您应该使用 .one() ：

将处理程序附加到元素的事件。每个事件类型的每个元素最多执行一次处理程序。

$(".clicker").one('click',function() { 
  $("#ltt").fadeIn("slow");
  $('#ltt').delay(2000).fadeOut('slow');
  $("#text2").delay(3000).fadeIn(1000);
  $clicked = '1';
});

Answer 3

您将变量声明为

var clicked = '0';

但是打电话

$clicked = '1';

稍后，所以你的变量将无法找到。

除了在PHP中，您不需要使用Dollar $来声明变量，这只是一个简单的错字：）

Answer 4

这应该有效：）

$(document).ready(function(){
    $("#text2").css("display","none");
    $("#ltt").css("display","none");
    window.clicked = false;
        $(".clicker").click(function() { 
            if(!window.clicked){
               $("#ltt").fadeIn("slow");
               $('#ltt').delay(2000).fadeOut('slow');
               $("#text2").delay(3000).fadeIn(1000);
               window.clicked = true;
            }
        });
});

单击时Jquery更改变量

4 个答案: