javascript - 使用 ajax/JQuery 更新数据表

标签 javascript php jquery ajax

我正在尝试使用 ajax/json 中的数据更新表。

这是 JQuery 代码: 更新为使用函数来简化执行。

$(document).ready(function() {
    //var userid = $( ".migrating" ).data( "userid" );

    function ajaxUpdate(userid){
        window.setInterval(function(){
         $.ajax({
                url: "info.php?userid=" + userid + "",
                async: true,
                type: "POST",
                data: "{}",

                contentType: "application/json; charset=utf-8",
                dataType: "json",

                success: function(results) {
                     $("#uid" + userid).html(results.uid);
                     $("#moved" + userid).html(results.moved);
                     $("#percentmoved" + userid).html(results.percentmoved);
                     $("#avgspeed" + userid).html(results.avgspeed);
                     $("#eta" + userid).html(results.eta);
                }
            });
        }, 3000); 
    }

    ajaxUpdate($(".migrating").data("userid"));

});

HTML 代码:

<table>
    <tr>
        <td><b>ID</b></td>
        <td><b>Moved</b></td>
        <td><b>Moved %</b></td>
        <td><b>Avg Speed</b></td>
        <td><b>ETA</b></td>
    </tr>

    <tr class="migrating" data-userid="101">
        <td><div id="uid101">Loading...</div></td>
        <td><div id="moved101">Loading...</div></td>
        <td><div id="percentmoved101">Loading...</div></td>
        <td><div id="avgspeed101">Loading...</div></td>
        <td><div id="eta101">Loading...</div></td>
    </tr>

    <tr class="migrating" data-userid="102">
        <td><div id="uid102">Loading...</div></td>
        <td><div id="moved102">Loading...</div></td>
        <td><div id="percentmoved102">Loading...</div></td>
        <td><div id="avgspeed102">Loading...</div></td>
        <td><div id="eta102">Loading...</div></td>
    </tr>

</table>

我想对表中 class="migration"的每个实例发出“ajaxUpdate()”。

我的 info.php 文件只是输出随机字符串和帖子字符串中的用户 ID,唯一的问题是我需要为每个字段执行此操作。

我假设问题的原因是有多个 class="migration"字段。

我尝试过搜索,但找不到任何特定于多行的内容。

最佳答案

您可以使用 jQuery.each循环遍历结果。与此类似的东西:

success: function(results) {
   $.each(results, function(index) {
       // your logic goes here.
   })
}

关于javascript - 使用 ajax/JQuery 更新数据表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19877668/

相关文章:

javascript - JQuery Cookie 设置过期时间

php - 如何将我的数据库带回 wamp 服务器?

php - curl 错误 35,可能的原因?

javascript - 如何在 Windows 7 上使用 NodeJS/PhantomJS/CasperJS

javascript - 不同字体的不同字母间距

php - 在 PHP 中实现 C 的 atoi()

Jquery 弹出错误消息?

javascript - 使用 knockout 可观察量进行计算会增加计算时间

javascript - 在 PHP 中编码 JSON 并使用 POST 提交

javascript - 如何根据编辑页面上复选框的值隐藏和显示字段