Несколько вызовов AJAX onclick работают только с одним элементом - PullRequest
0 голосов
/ 22 августа 2011

Так вот мой HTML:

<div class='delete-item' name='filetest' ></div>
<div class='delete-item' name='anothertest' ></div>
<div class='delete-item' name='coolfile' ></div>

И мой JavaScript

$(".delete-item").click(function() {

    $.ajax({
        type: "GET",
        url: "delete_item.php",
        data: "name="+$(this).attr("name")+"&dir=<?php echo $encodedDirectory; ?>",
        success: function(data) {
            refreshItemList();
        }
    });

});

Так что код работает, но только для одного элемента.Какой бы щелчок я ни щелкнул, он сработает, и вызов ajax будет успешно завершен.Однако нажатие на другое даже не вызывает функцию (я попытался зарегистрировать ее на консоли, и она даже не регистрировала ничего, кроме первого элемента.)

1 Ответ

2 голосов
/ 22 августа 2011

Попробуйте использовать jQuery.live вместо bind:

$(".delete-item").live('click', function() {

Когда вы делаете $(".delete-item").click(...), jquery прикрепляет событие ко всем .delete-item элементам на странице. Но в refreshItemList(); вы заменяете их новыми, и к новым не добавляется обработчик событий.

jQuery.live() добавляет события ко всем элементам, соответствующим .delete-item во время его вызова, а также .delete-item, созданным после его вызова.

...