0

我有一个 AJAX 方法，可以从数据库的结果列表中删除数据库中的一行。成功删除该行后，我希望 jQuery 从页面中淡出该行。

单击删除按钮后，该行已成功从数据库中删除，但作为被单击按钮的父项的列表项在使用最接近（）搜索时不会淡出。

这是我的 DOM：

<ul>
    <li>
        <div class="two columns alpha">
        </div>
        <div class="ten columns">
            <ul>
                <li><p></p></li>
                <li><p></p></li>
            </ul>
        </div>
        <div class="admin_buttons">
            <div class="two columns">
                <button type="submit" class="admin_button edit_event">Edit</button>
            </div>
            <div class="two columns omega">
                <button type="submit" value="5" class="admin_button delete_event">Delete</button>
            </div>
        </div>
    </li>
</ul>

这是jQuery：

$(document).on('click', '.delete_event', function() {
    $.ajax({
        type: 'POST',
        url: 'php/deleteEvent.php',
        cache: false,
        data: {
            id: $(this).val()
        },
        success: function(data) {
            if(data === 'Error') {
                alert('Error: event not deleted.');
            }
            else
            {
                $(this).closest("li").fadeOut('slow');
            }
        }
    });

});
4

1 回答 1

2

它没有按预期工作的原因是因为this您进入success回调不是this您在点击处理程序中拥有的。

.ajax()可以context选择将传递给success回调的内容设置为this. 你可以使用它：

$.ajax({
    type: 'POST',
    ...
    context: $(this), // set what 'this' will be inside the callback.
    ...
    success: function(data) {
        ...
        // this refers to what we set for context
        this.closest("li").fadeOut('slow'); 
        ...
    }
});
于 2012-12-02T05:17:50.553 回答