Jquery изменение переменной по клику

Question

Jquery изменение переменной по клику

Верно, я бы хотел, чтобы при нажатии кнопки (или в данном случае какого-то текста) 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>

843 4

jQuery javascript html css

4 ответов:

Comments

Ничего не найдено.

Rajaprabhu Aravindasamy · Accepted Answer · 2014-05-12 15:15:23

Попробуйте использовать .one() в этом контексте
$(".clicker").one('click', function() { 
    $("#ltt").fadeIn("slow");
    $('#ltt').delay(2000).fadeOut('slow');
    $("#text2").delay(3000).fadeIn(1000);
});

Milind Anantwar · Accepted Answer · 2014-05-12 15:15:48

Вы должны использовать .один() вместо этого:

Присоедините обработчик к событию для элементов. Обработчик выполняется не более одного раза на элемент для каждого типа события.
$(".clicker").one('click',function() { 
  $("#ltt").fadeIn("slow");
  $('#ltt').delay(2000).fadeOut('slow');
  $("#text2").delay(3000).fadeIn(1000);
  $clicked = '1';
});

KhorneHoly · Accepted Answer · 2014-05-12 15:16:54

Вы объявили переменную в
var clicked = '0'; 
Но зовет
$clicked = '1';
Позже, так что ваша переменная не будет найдена.

Кроме того, что в PHP вам не нужен доллар $ для объявления переменной, это просто простая опечатка:)

LNT · Accepted Answer · 2014-05-12 15:20:32

Ну это должно сработать :)

$(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;
            }
        });
});