Question

感谢您查看此帖子。我正面临着一个jquery问题。在成功进行AJAX调用后，我想更新页面上的元素。但是，它没有更新。

我正在做什么我打开一个文本框点击跨度然后添加文本和焦点输出事件我正在进行Ajax调用但不能更新新文本到同一范围我点击之前请帮助我

这是我的js代码

$(document).on('click', '.td-edit', (function (e0) {
    var thisObj = $(this);
    var olddata = thisObj.html();
    var newDom = '<input type="text" value="' + olddata + '"  class="new-value" style="border:#bbb 1px solid;padding-left:5px;width:75%;"/ >';
    thisObj.parent('td').html(newDom);
}));
$(document).on('focusout', '.new-value', (function (e1) {
    var thisObj = $(this);
    var type = thisObj.parent('td').attr('class');
    var newData = thisObj.val();
    var santanceId = thisObj.parent('td').parent('tr').attr('id');
    santanceId = parseInt(santanceId.replace('tr', ''));
    thisObj.parent('td').html('\'<img src="uploads/loading.gif">\'');
    if (type === 'sentnc') {
        $.ajax({
            type: "POST",
            url: "operations.php",
            data: {
                santanceId: santanceId,
                sentnc: newData
            },
            success: function () {
                var newDom = '<span class="td-edit">' + newData + '</span>';
                thisObj.parent('td').html(newDom);
            }
        });

    }
}));

HTML：

<div class="chat-space nano nscroller">
  <div id="table-row">
    <table id="rep-data">
      <tbody>
        <tr>
          <th align="left">Sentences</th>
          <th align="left" colspan="3">Reps</th>
        </tr>
        <tr id="tr1" rowspan="2">
          <td class="sentnc"><span class="td-edit">Rana is working</span></td>
          <td colspan="3" class="senrep"><span class="td-edit">p1.ref = I, p1.name = julie</span><br>
            <br>
            <span style="color:#000;">Guess Rep1:&nbsp;</span><span id="1gr1">p1.ref = I, p1.has = name1, p1.name.made_from = rana</span><br>
            <span style="color:#000;">Guess Rep2:&nbsp;</span><span id="2gr1">p1.ref = I, p1.name = rana</span><br>
            <span><a style="color:#3399FF !important;" alt="1" rel="1 " class="updateGuess" id="upd1" href="javascript:void(0);">Update Guess Rep</a></span><br>
            <br></td>
        </tr>

      </tbody>
    </table>
  </div>

Answer 1

您的success处理程序应为：

success: function (data) {
                var newDom = '<span class="td-edit">' + data + '</span>';
                thisObj.parent('td').html(newDom);
            }

此处，data是服务器在ajax调用

之后返回的数据

成功的AJAX调用后，无法更新td数据

1 个答案: