jQuery：在單擊ajax時，完成或失敗的對象是否被單擊？

Question

簡單的ajax查詢，但使用.click()事件為類的每個項目觸發。 當到達.done()我無法弄清楚如何查找被單擊的元素，因此我可以正確刪除m_action類。

下面是代碼。 我確定我缺少一些簡單的東西，但是我一直在用Chrome和Firefox網絡工具進行搜索，但是沒有運氣，並且在Stack上找不到重復的問題。

簡而言之： 使用下面的代碼，如何在成功的jQuery ajax返回上正確刪除clicked元素的m_action類？

<script type="text/javascript">
    jQuery("div#normal .m_action").click(function() {
        jQuery.ajax({
            url: "./action.php",
            type: "POST",
            data: { action: this.id }
        }).done(function(result) {
            jQuery(this).removeClass("m_action");
            jQuery(this).html(result);
        }).fail(function(result) {
            alert("There was an error.")
        });
    })
</script>

Answer 1

您可以只存儲對它的引用，以便該范圍內的任何地方都可以使用它：

jQuery("div#normal .m_action").click(function() {

    var elem = this; // <-- right here

    jQuery.ajax({
        url: "./action.php",
        type: "POST",
        data: { action: this.id }
    }).done(function(result) {
        jQuery(elem).removeClass("m_action"); // <-- elem is still available
        jQuery(elem).html(result); // <--
    }).fail(function(result) {
        alert("There was an error.")
    });
});

只是對未來的說明，您的問題與jQuery無關。 這只是范圍內變量的簡單使用。 this指針在done函數內更改，因此您只需要緩存引用。

Answer 2

此代碼應工作：

$(document).ready(function()
{
    jQuery(".m_action").click(function() {
        var self = $(this);
        jQuery.ajax({
            url: "./action.php",
            type: "POST",
            data: { action: this.id }
        }).done(function(result) {
            self.removeClass("m_action");
            self.html(result);
        }).fail(function(result) {
            alert("There was an error.")
        });
    })

});
</script>