jquery - jQuery 使用 $.ajax 更改值

Question

我有一张这样的桌子：

<table id="table-name">
    <tr><td id="td-name">something</td></tr>
    <tr><td id="td-name">something</td></tr>
    <tr><td id="td-name">something</td></tr>
    <tr><td id="td-name">something</td></tr>
</table>

我正在尝试使用 jQuery 更改“某物”值，如下所示：

$("#table-name #td-name").each(function () {
    $.ajax({
    type: "POST",
    url: "file.asp",
    data: $(this).html()        
    }).done(function r(returnOfASP) {
        $(this).html(returnOfASP);
    });         
});

它使用“file.asp”进行数据库查询。“某事”是数据库查询的参数。“file.asp”正确返回查询，但我无法更改<td>值（html）。我想$(this)Ajax 的“完成”是不正确的，但我不知道该怎么做。

Answer 1

像这样更改您的 jQuery 代码：

$("#table-name td").each(function () {
    var self = this;
    $.ajax({
        type: "POST",
        url: "file.asp",
        data: $(this).html()        
    }).done(function r(returnOfASP) {
    $(self).html(returnOfASP);
    });         
});

您不能在一个页面上有多个 id，这可能会弄乱您的选择器。如果你想过滤更多，你可以使用类。此外，保存this到变量可能会解决这个问题。

你还有一个额外的东西});，之后不应该在那里$(this).html()

希望这会有所帮助。

Answer 2

使用 jQuery $.proxy()在不同的上下文中委托执行。在你的情况下，它是父母。

$("#table-name #td-name").each(function () {
    $.ajax({
        type: "POST",
        url: "file.asp",
        data: $(this).html()        
    }).done($.proxy(function(response) { $(this).html(returnOfASP); }, this));
});

Answer 3

你的 td 需要唯一的 id 或者它应该被称为类。

如果你想循环它们然后给 td 类

<table id="table-name">
    <tr><td class="tdName">something</td></tr>
    <tr><td class="tdName">something</td></tr>
    <tr><td class="tdName">something</td></tr>
    <tr><td class="tdName">something</td></tr>
</table>

Javascript 测试

$("#table-name .tdName").each(function () {
    // do code in here

    // test output in firebug with
    console.log($(this));
});