Javascript Jquery不起作用。 $（本）

Question

$(document).ready(function() {
    $(".delete_user_button").click(function(){
        var username_to_delete = $(this).attr('rel');
        $.ajax({
            type:"POST",
            url:"/delete/",
            data:{'username_to_delete':username_to_delete},
            beforeSend:function() {
                $(this).val("Removing...");
            },
            success:function(html){
                $("div.delete_div[rel=" + username_to_delete + "]").remove();
            }
            });
        return false;
    });
});

為什么$（this）.val（）不起作用？ 我正在嘗試在用戶單擊刪除時更改按鈕的文本。

Answer 1

在事件處理（beforeSend）， this是指用於Ajax調用的XMLHttpRequest對象，而不是你原來this單擊事件處理程序的。 你應該首先在變量中“捕獲”它：

$(document).ready(function() {
    $(".delete_user_button").click(function(){
        var element = $(this);
        var username_to_delete = element.attr('rel');
        $.ajax({
            type:"POST",
            url:"/delete/",
            data:{'username_to_delete':username_to_delete},
            beforeSend:function() {
                element.val("Removing...");
            },
            success:function(html){
                $("div.delete_div[rel=" + username_to_delete + "]").remove();
            }
            });
        return false;
    });
});

這種機制稱為“閉包”。 有關此問題的有趣解釋，請查看此鏈接：

http://www.bennadel.com/blog/1482-A-Graphical-Explanation-Of-Javascript-Closures-In-A-jQuery-Context.htm

Answer 2

沒有更多關於上下文的知識或分析腳本本身：請記住，在某些環境中，$本身可能無法工作並且需要用jQuery替換 - 我在Liferay中已經看到了這一點。

我想這不是你的問題，但對於從其他環境中尋找這個問題的其他人來說，它可能會派上用場。