0

我做错了什么？我想动态更改 div 的文本并将 css 类添加/删除到这个 div。' 有几个 div 名称相同但 id 不同

 <div class="mydiv" id="1">Text</div>
 <div class="mydiv" id="2">Text</div> 
 <div class="mydiv" id="3">Text</div> 

 <input type="hidden" name="myfield" id="myfield" value="myvalue" />

我正在向 Spring MVC 控制器发送 ajax 帖子并完美地得到答案（数据）真或假。但是正如我所看到的，它首先生成所有值 $(".mydiv").attr("id") 并且在成功之后看不到 this.id 进行动态更改。我该如何解决这个问题？ 

$(document).ready(function () {
    $.each($('.mydiv'), function () {
        var code = $(".mydiv").attr("id");

        $.ajax({
            url: '/mycontroller',
            type: 'POST',
            dataType: 'json',
            data: {
                id: $("#myfield").attr("value"),
                codeId: this.id
            },
            success: function (data) {
                if (data == false) {
                    $("#" + this.id).addClass("myNewClass");
                    $("#" + this.id).text("FirstText");
                } else {
                    $("#" + this.id).removeClass("myNewClass");
                    $("#" + this.id).text("SecondText");
                }
            }
        });
    });
});
4

2 回答 2

0

尝试

看起来有多个问题，从循环开始，ajax成功回调的执行上下文等

$(document).ready(function () {
    $('.mydiv').each(function () {
        //use this.id to get the current elements id - $(".mydiv").attr("id") will give the id of first element with class mydiv
        var code = this.id;

        $.ajax({
            url: '/mycontroller',
            type: 'POST',
            dataType: 'json',
            data: {
                id: $("#myfield").attr("value"),
                codeId: this.id
            },
            success: $.proxy(function (data) {
                //inside the callback this was not pointing the element, here a proxy based soution is used
                //another solution is to assign var self = this; before the ajax request and then instead of this inside the function use self
                if (data == false) {
                    $(this).addClass("myNewClass");
                    $(this).text("FirstText");
                } else {
                    $(this).removeClass("myNewClass");
                    $(this).text("SecondText");
                }
            }, this)
        });
    });
});
于 2013-08-30T06:05:24.837 回答
0

尝试.html()代替.text()

于 2013-08-30T06:12:37.907 回答