jQuery .click Функция не работает после вызова функции

Question

jQuery .click Функция не работает после вызова функции

0

У меня проблема с 3 днями, поэтому проблема заключается в том, что когда я перемещаю кусок, он обновит доску так, чтобы ai мог двигаться, после обновления на доске функция нажатия перестала работать.

    function drawBoard(board) {
     var str = '';

       for( var x = 0 ; x < 8 ; x++ ){
           for( var y = 0 ; y < 9 ; y++ ){
              str += '<div id="mydiv" class="cell" data-square="'+ x +","+ y +'">' +
              '<div class="'+checkPiece(board[x][y]) +' '+ getPieceName(board[x][y]) + '" data-value="' + board[x][y] + '"></div>' +
              '</div>';
           }

       }
    $('#board').html(str);
    }

После того, как я снова вызову drawBoard (доска); для перерисовки доски функция нажатия перестанет работать.

Здесь ссылка JSFiddle.

reyes 16 окт. 2013, в 07:19

Источник

Теги:

jquery

2 ответа

0

Функция $.click работает только с объектами, которые существуют при первом вызове.

Поскольку вы привязываете его к div и затем вытираете их вызовом.html(), новые divs не имеют привязанного к ним события щелчка.

Вместо этого используйте $.on и привяжите его к более крупному объекту доски.

$("#board").on("click", "div", function () {
    //your click code here
});

Это гарантирует, что события щелчка привязаны к любым будущим div, размещенным внутри доски.

arm5077 16 окт. 2013, в 03:42

Ещё вопросы

Adam Rackis · Accepted Answer · 2013-10-16T03-31-00.000Z

Проблема заключается в том, как вы настраиваете обработку событий:

$('.blue').each(function (index, div) {
    $(div).click(function() {

будет только подключать divs с blue классом, которые существуют прямо в этот момент. Любые divs, динамически добавленные позднее, не будут подключены к этому событию.

Вам необходимо использовать делегированную обработку событий. Самое простое, наивное, наименее эффективное решение - это сделать

$(document).on('click', 'div.blue', function(){ ...

Просто отметьте, что

$(document).on('click',

является немного печально известным, поскольку, поскольку он вызывает все события кликов в любой точке страницы, чтобы пузыриться и быть проверены. Если ваш дом настроен таким образом, что все эти div всегда будут в своем контейнере, вы можете и должны настроить обработку событий оттуда. Например, если все эти divs находятся в контейнере с именем "foo", вы должны настроить свой обработчик следующим образом:

$('#foo').on('click', 'div.blue', function(){ ....