Javascript 条件addClass不适用于具有相同类的每个元素

Les说我有一些同级别的按钮。在页面加载时，我使用ajax检查每个按钮的一些值。根据ajax请求的返回值，我想向按钮添加一些类，但它不起作用

$(document).ready(function(){
    $('.add-remove-permissoion').each(function(){
        var child = $(this).val();
        var parent = $('#parent-name').text();
        $.get('my-url', function(data){
            if(data == 1){
                $(this).addClass('glyphicon glyphicon-ok');
            }else{
                $(this).addClass('emptybox-blank');
            }
        });
    });
});

我已经检查了我的ajax请求是否返回了正确的数据。我在这里做错了什么？

问题是

$（这）

在ajax调用中并没有指向单击的按钮

将

$（this.addClass

替换为

myElement.addClass

。在ajax调用之前的click事件中创建

myElement

：

var myElement=$（此）

问题在于ajax调用中的

$（此）

没有指向单击的按钮

---

将

$（this.addClass

替换为

myElement.addClass

。在ajax调用之前的click事件中创建

myElement

：

var myElement=$（this）

问题在于ajax回调中的this引用，在

success

回调

中，this

指的是

jqXHR

对象，而不是dom元素引用，这就是它不工作的原因

您可以使用下面给出的闭包变量来解决此问题

$(document).ready(function () {
    $('.add-remove-permissoion').each(function () {
        var $this = $(this),
            child = $this.val();
        var parent = $('#parent-name').text();
        $.get('my-url', {}, function (data) {
            if (data == 1) {
                $this.addClass('glyphicon glyphicon-ok');
            } else {
                $this.addClass('emptybox-blank');
            }
        });
    });
});

---

问题在于ajax回调中的this引用，在

success

callback

中，this

引用的是

jqXHR

对象，而不是dom元素引用，这就是它不工作的原因

您可以使用下面给出的闭包变量来解决此问题

$(document).ready(function () {
    $('.add-remove-permissoion').each(function () {
        var $this = $(this),
            child = $this.val();
        var parent = $('#parent-name').text();
        $.get('my-url', {}, function (data) {
            if (data == 1) {
                $this.addClass('glyphicon glyphicon-ok');
            } else {
                $this.addClass('emptybox-blank');
            }
        });
    });
});

---

此

在

$的上下文中。get

处理程序不引用当前迭代的元素。每个函数都有自己的

值。你有几个选择

使用
每个
回调的第二个参数

$('.add-remove-permissoion').each(function(index, element) {


使用
$.proxy
或
Function.prototype.bind
方法设置处理程序的
此
值

$.get('my-url', function(data) {
    // ...
}.bind(this));


缓存
每个
处理程序的
此
值，并在
$中使用它。获取
处理程序

var elem = this;
$.get('my-url', function(data) {
    // ...
    $(elem)...
});


还请注意，代码中存在语法错误：

$.get('my-url'}, function(data){
// -----------^

此
在
$的上下文中。get
处理程序不引用当前迭代的元素。每个函数都有自己的
值。你有几个选择

使用
每个
回调的第二个参数

$('.add-remove-permissoion').each(function(index, element) {


使用
$.proxy
或
Function.prototype.bind
方法设置处理程序的
此
值

$.get('my-url', function(data) {
    // ...
}.bind(this));


缓存
每个
处理程序的
此
值，并在
$中使用它。获取
处理程序

var elem = this;
$.get('my-url', function(data) {
    // ...
    $(elem)...
});


还请注意，代码中存在语法错误：

$.get('my-url'}, function(data){
// -----------^

你在变量中使用了$sign，$this，我想你需要纠正它。你在变量中使用了$sign，$this，我想你需要纠正它。