用新数据替换附加的数据

Replace appended data with new data

本文关键字:数据 替换 新数据      更新时间:2023-09-26

我有一个表单,当用户提交值时,我使用的jquery脚本计算表单值并输出计算出的数据。

这个工作正常,除非用户再次单击提交按钮,它会将我删除的数据附加到现有数据(复制或重新附加新数据)。

如果用户单击两次submit,我只想让它覆盖现有的循环输出。

  for (i = 1; i <= $jumps; i++) {
        if (i == 1) {
            var $num = $jumpSize * i;
        } else if (i == 2) {
            var $num = ($jumpSize * i) + $stops;
        } else {
            var $num = ($jumpSize * i) + ((i - 1) * $stops);
        }
        $('.output').append("<p>Num:" + i + " " + parseInt($num) + "</p>");
    }

如果用户点击两次提交按钮,是否有可能替换循环数据?

这里有一个演示http://jsfiddle.net/knard/EY8MJ/13/

使用。html代替。append来替换内容。例如…

$('.output').html("<p>Num:" + i + " " + parseInt($num) + "</p>");

我也遇到过同样的问题。我是这样解决的。假设您期望每次使用ajax发出请求时都有新的响应

      $.ajax({
        url: "scanner/",
        type: "POST",
        data: {
            'csrfmiddlewaretoken': csrf,
            'barnumber': $("#search-input").val(),
            'id':id
             },
             
        success: function (res) {
            const data = res.data
            console.log(data)
            $('student-result').html("");
            data.forEach(e=>$('#student-result').html(`
             <tbody >
                <tr>
                  <td>Name:</td>
                  <td class="font-medium text-dark-medium">
                    ${e.lname} 
                    ${e.fname}
                  </td>
                </tr>
              
              </tbody>
            `));
        
    });

注意事项。而不是使用。append方法来呈现数据,使用.html直接呈现元素id代替它

在循环之前添加这行$('.output').html("");,当提交按钮被按下时,它将清除内容。演示:http://jsfiddle.net/EY8MJ/14/

尝试:

$('.output').empty().append("<p>Num:" + i + " " + parseInt($num) + "</p>");