Question

我创建了一个按钮，当点击使用服务器中的Ajax执行操作时，当从按钮的服务器颜色返回并且其文本将发生变化时（类似于在facebook中添加朋友的+1）这里是{{1}中的代码}：

.js

每件事都没问题，请求会成功更改数据库但是当它回到成功回调时我只看到浏览器上的$(".blue").on("click", function(){ var firstName = $(this).prev().prev().text(); var lastName = $(this).prev().text(); $(this).text("Add Friend..."); var data={ firstName: firstName, lastName: lastName }; $.ajax({ url: '/ajax/friendRequest', data: data, dataType: 'json', success:function(){ alert(123); $(this).removeClass("glass blue"); $(this).addClass("greenStatic"); $(this).text("Request sent"); } }); });，而下面的3行没有运行，我的chrome开发人员工具抛出异常alert(123);我搜索了SO并将typeError符号更改为$，但我仍有同样的问题

Answer 1

在你的成功中，回调$(this)没有引用该按钮，将其缓存在成功回调之外，如

$(".blue").on("click", function(){
    var btn = $(this);
    ...
    ....
    success:function(){
        ...
        btn.addClass("greenStatic");
        ...
    }
});

Answer 2

        $(this).removeClass("glass blue");
        $(this).addClass("greenStatic");
        $(this).text("Request sent");

这里this没有引用控件，而是引用了Ajax请求对象。因此，请使用控件ID替换this。它应该工作。

如下所示...

        $("#controlId").removeClass("glass blue");
        $("#controlId").addClass("greenStatic");
        $("#controlId").text("Request sent");

成功回调中的JQuery Ajax Type错误

2 个答案: