1

我创建了一个按钮,当点击在服务器中使用 Ajax 执行某些操作时,当从服务器返回按钮的颜色时,它的文本会发生变化(类似于 +1 在 facebook 中添加朋友)这是我的代码.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");
        }
    });
});

一切正常,请求将成功更改数据库,但是当它返回成功回调时,我只alert(123);在浏览器上看到,下面的 3 行没有运行,我的 chrome 开发人员工具抛出异常,typeError我搜索 SO 并将$符号更改为jQuery但我仍然有同样的问题

4

2 回答 2

3

在您的成功回调$(this)中不引用按钮,将其缓存在成功回调之外,例如

$(".blue").on("click", function(){
    var btn = $(this);
    ...
    ....
    success:function(){
        ...
        btn.addClass("greenStatic");
        ...
    }
});
于 2013-09-06T19:52:42.613 回答
1
        $(this).removeClass("glass blue");
        $(this).addClass("greenStatic");
        $(this).text("Request sent");

这里this不是指控件,而是指 Ajax 请求对象。因此,替换this为控件 ID。它应该工作。

像下面这样...

        $("#controlId").removeClass("glass blue");
        $("#controlId").addClass("greenStatic");
        $("#controlId").text("Request sent");
于 2013-09-06T19:59:14.767 回答