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>