Question

我有很多行

列出项目 - 删除
列出项目 - 删除
列出项目 - 删除

基本上阻止了点击元素，然后从后端恢复错误的元素。

我需要使用哪种方法？我使用live方法，如果我使用die，那么我将如何恢复？

Answer 1

根据要求，这是一个使用链接而不是按钮的版本。

<ol>
    <li id="item-1">List item <a href="delete.php?1">Delete</a></li>
    <li id="item-2">List item <a href="delete.php?2">Delete</a></li>
    <li id="item-3">List item <a href="delete.php?3">Delete</a></li>
</ol>

JS对此的支持将是

$("ol").click(function(evt){
    if (evt.target.nodeName != "A") {
        return true;// it's not the delete link, so we don't have to do anything
    }
    var listItem = $(evt.target.parentNode);
    if (listItem.hasClass("disabled")) {
        return true;// we're still processing this already deleted list item
    }
    listItem.addClass("disabled");// lock the list item (perhaps visually too)

    // set up the AJAX call
    $.post("evaluator.php", {listId : listItem.attr("id")}, function(data){
        // let's suppose that we get "1" if the user can perform the procedure
        if (data == "1") {
           // request approved, remove the list item
           listItem.fadeOut("fast", function(){
               $(this).remove();
           });
        } else {
            // release the lock
            listItem.removeClass("disabled");
            // request denied, rollback
            alert("Sorry, you can't do that.");
        }
    });
    // here we stop the click event, so the URL in href won't be called.
    // you can "disable" a link by returning false on a click event
    // e.g. <a href="url" onclick="return false">disabled link</a>
    return false;
});

Answer 2

最好的方法是创建一个单独的函数来处理AJAX调用，所以你可以这样做

$(".delete").bind("click", deleteItem);

在你的deleteItem函数中你可以通过执行

解除绑定

function deleteItem(delBtn) {
    $(delBtn).unbind("click", deleteItem);
    //ajax call
    onerror: function() {
        $(delBtn).bind("click", deleteItem);
    }
}

修改：意识到您正在使用live，这只是bind的另一个版本。因此，在上面的示例中，您只需为bind切换live关键字，为unbind切换die。它应该做同样的事情（：

jquery单击一次，然后禁用/启用元素

2 个答案: