как переменная область видимости работает в jquery?

Question

var change = 1;

$("#game").click(function (e) {
    if (change == 1) {
        var data = $(e.target).closest("td").text();
        var p1 = $("#player1").val();
        var p1_value = p1 + data;
        $("#player1").val(p1_value);
        change = 2;
    } else(change == 2) {
        var data = $(e.target).closest("td").text();
        var p2 = $("#player2").val();
        var p2_value = p2 + data;
        $("#player2").val(p1_value);
        change = 1;
    }

});

Это способ записи?Кстати, здесь это не идет в другой цикл.

Answer 1

JavaScript имеет только область действия , а не "область фигурных скобок". Если вы хотите быть очень правильным, вы должны поместить все объявления вверху функции:

$("#game").click(function(e) {
    var data = '',
        p1 = '',
        p1_value = '',
        p2 = '',
        p2_value = '';

        if (change == 1) {
            data = $(e.target).closest("td").text();
            p1 = $("#player1").val();
            p1_value = p1 + data;
            $("#player1").val(p1_value);
            change = 2;
        }
        else if (change == 2) { // you forgot `if`
            data = $(e.target).closest("td").text();
            p2 = $("#player2").val();
            p2_value = p2 + data;
            $("#player2").val(p1_value);
            change = 1;
        }
});

Как минимум JSLint жалуется на то, что data уже определено.

Но вы можете оптимизировать (и сократить!) Свою функцию другим способом:

$("#game").click(function(e) {
    var $player = $('#player' + change);
    $player.val($player.val() + $(e.target).closest("td").text());
    change = (change === 1) ? 2 : 1;
}

Answer 2

Ваш else должен быть else if, если вы собираетесь использовать условие:

if (change == 1) {
    // ...
} else if(change == 2) {
    // ...
}

В качестве лучшей альтернативы вы можете использовать jQuery .toggle() и передать ему две функции, которые чередуются при нажатии.

$("#game").toggle(function(e) {
            var data = $(e.target).closest("td").text();
            var p1 = $("#player1").val();
            var p1_value = p1 + data;
            $("#player1").val(p1_value);
 }, function(e) {
            var data = $(e.target).closest("td").text();
            var p2 = $("#player2").val();
            var p2_value = p2 + data;
            $("#player2").val(p1_value);
 });