Question

我希望用户单击一个DIV元素并将其添加到JavaScript中的变量中，并且当该变量的值发生变化时会发生不同的事情。当我第一次单击div元素时，它会显示“你在这里！”但是当我第二次点击div元素时......似乎没有任何事情发生。似乎变量没有更新。

var $test = 0;
$( document ).ready(function() {

if ($test == 0) {
    $("#textbox").click(function() {
        $(textbox).text("You and here!");
        $test = $test + 1;
        });
    };

if ($test == 1) {
    $("#textbox").click(function() {
        $(textbox).text("Now, you are there!");
        $test = $test + 1;
        });
    };
});

Answer 1

您需要检查点击处理程序中的条件

$(document).ready(function () {
    //declare it as a closure variable instead of addint it to the global scope
    var test = 0;
    $("#textbox").click(function () {
        //check the value of test here
        if (test == 0) {
            $(textbox).text("You and here!");
        } else if (test == 1) { //or just else
            $(textbox).text("Now, you are there!");
        }
        //increment the value of test
        test++;
    });
});

Answer 2

请以下面的方式编写您的代码希望它会有所帮助

var $test = 0;
$(document).ready(function () {

  $("#textbox").click(function () {

    if ($test == 0) {
      $(textbox).text("You and here!");
    };

    if ($test == 1) {
      $(textbox).text("Now, you are there!");
    };

    $test = $test + 1;
  });
});

Answer 3

在事件处理程序内部测试$ test变量，并且在文档就绪事件中只需要附加一个事件处理程序。 BTW文件就绪功能只运行一次。

Answer 4

错误是：您正在为$test变量的每个值注册一个新的事件处理程序。相反，试试这个：

var $test = 0;
$( document ).ready(function() {
    $("#textbox").click(function() {
        switch($test) {
            case 0:
                $(this).val("You and here!");
                $test = $test + 1;
            break;
            case 1:
                $(this).val("Now, you are there!");
                $test = $test + 1;
            break;
         }
    });
});

Fiddle

Answer 5

只是我的版本：

$(document).ready(function () {
    var test     = 0,
        $textBox = $('#textbox');
    $textbox.on('click', function () {
        var message;
        if (test == 0) { message = "You and here!"; } 
        if (test == 1) { message = "Now, you are there!"; }
        if (message)   { $textbox.text(message); }
        test++;
    });
});

咖啡只是为了好玩

$ ->
  test     = 0 
  $textBox = $ '#textbox'
  $textBox.on 'click', ->
    message = switch test
      when 0 then "You and here!"
      when 1 then "Now, you are there!"
    $textbox.text message if message
    test++

jQuery / JS - 变量似乎没有更新？

5 个答案: