Question

我尝试使用jQuery获得最近的按钮点击按钮并删除它但似乎没有点燃

这是我的标记

<li class="dd-item dd3-item" data-id="22">
    <div class="dd-handle dd3-handle"></div>
    <div class="dd3-content">some other
        <span class="pull-right" style="display: none;">
            <a data-target="#settings_22" data-action="collapse" href="#"><i class="fa fa-pencil"></i></a>
        </span>
    </div>

    <form method="post" action="#" class="menu_settings" style="display: block;">
        <input type="hidden" value="22" name="id">
        <fieldset>

            <div role="toolbar" class="btn-toolbar">
                <div class="btn-group btn-group-sm">
                    <button type="button" data-action="update" class="update btn btn-default"><i class="fa fa-upload"></i> Update</button>
                    <button type="button" data-action="delete" class="delete btn btn-default"><i class="fa fa-trash-o"></i> Trash</button>
                    <button type="button" class="cancel btn btn-default"><i class="fa fa-times"></i> Cancel</button>    
                </div>                                
            </div>
        </fieldset>                        
    </form>
</li>

的jQuery

$('button.update, button.delete').on('click', function(e) {
    e.preventDefault();
    var url = ajaxurl + '?action=updateCategories';
    var data = $(this).closest('form').serialize();
    var action = $(this).data('action');
    $.ajax({
        type: "POST",
        url: url,
        data: {
            data: data,
            command:action
        },
        //contentType: "application/json; charset=utf-8",
        //dataType: "json",
        cache: false,
        success: function(html) {
            if (action == 'delete') {
                alert('delete');
                $(this).closest('li').remove();
            }
        }
    });
});

我确实收到提醒，但列表未删除

Answer 1

默认情况下，成功回调是在this引用window时执行的;这可能不是你想要的。

您可以使用this的{{1}}选项绑定成功回调中的context：

$.ajax

这确保在成功回调中使用$.ajax({ ..., context: this, ... });将是被点击的元素。

用jQuery获得最接近的li

1 个答案: