Question

我有一个事件的人员列表，通过ajax和事件的ID一起调用，并放入div。（我可以通过选择列表更改哪个事件会显示。）

如果我检查一个人（每个人后面的复选框），他们会得到一个＆＃34;删除＆＃34;的课程。然后将它们隐藏在列表中。

$(this).hide();.

我还有一个名为Show All的按钮，点击后会调用此代码：

$(document).on('click', '#showAll', function () {
    $('.removed').toggle();
});

这有效，直到我更改列表。如果我更改列表，按下显示全部按钮时没有任何反应。如果我然后改回上一个事件，它就像以前一样工作。

所以问题是，Show All按钮被锁定到我使用按钮的第一个事件，然后当我切换事件时我无法使用它。它只有在刷新页面时才有效。

我在某处读到了使用event.preventDefault（）;但它仍然无法运作（也许它根本不是解决方案）。我还尝试使用ajax获取Show All-button并在每次更改事件时重新加载它（好像它会破坏与当前事件的连接），但它仍然无法工作（我真的不喜欢＆＃ 39;理解为什么用这个解决方案）。

修改：我删除了不相关的代码并将其清理干净了一点。（我注意到ShowAll按钮有一个类，而不是我之前写过的ID。

/* HTML for the button */
<td class="showAll button">Show All</td>

/* jQuery */

$('#eventID').change(function() { //Select-list

    eventID = $(this).find('option:selected').val();

    function check() { // To mark a person who has attended and give them a class of removed
        $('#allAttendees').on('click', 'input[type="checkbox"]', function() {
            var email = $(this).val();
            var removed;

            removed = $(this).attr('name');

            $('#allAttendees tr[value="'+email+'"]').hide();
            $('#allAttendees tr.removed').hide();

            $.ajax({
                url: /* path */,
                type: 'POST',
                data: 'eventID=' + eventID + '&email=' + email + '&removed=' + removed,
                success: function(ADD) {
                    getAll();
                }
            });
        });
    }

    function getAll() { // Gets the list of all persons for the event
        $.ajax({
            url: /* path */,
            type: 'POST',
            data: 'eventID=' + eventID,
            success: function(getAttendieesData) {
                $('#attendies').html(getAttendieesData);

                check();
            }
        });     
    }

    $(document).on('click', '.showAll', function () { // Should hide/show all persons with the class removed, but only works on the first event I use it on
        $('.removed').toggle();
    });

});

jQuery - .on（'click'..不适用于新的AJAX内容

0 个答案: