Question

首先我要说的是，我的编码时间不到一周。我正在尝试创建一个javascript，它将使用AJAX调用刷新我的数据，该调用将PHP的JSON编码文件吐出到更易读的文件中。

我已成功将json吐出到HTML表格中，但是，我想自动刷新这些数据，这样当数据库发生变化时，我的HTML也会发生变化。

    $(document).ready(function(){

refresh();
});

function refresh() {
setTimeout( function() {
dbupdates(); 
refresh();
}, 500);
}   

function dbupdates(){
$.ajax({
    url: 'fetchtest.php',
    type: 'get',
    dataType: 'JSON',
    success: function(response){
// for loop to only write 10 
        for(var i=0; i<10; i++){
            var id01 = response[i].id1; 
            var id02 = response[i].id2;
            var id03 = response[i].id3;
// tr located in html
            var tr_str = "<tr>" +
                "<td align='center'>" + id01 + "</td>" +
                "<td align='center'>" + id02 + "</td>" +
                "<td align='center'>" + id03 + "</td>" +
                "</tr>";
// table ID in html file
            $("#HTMLTABLE").append(tr_str);  
        }

    }
});
};

当我运行网页时，它会进入一个无限循环，它只会创建相同数据的新10条目表（如果数据库更改，可能会更改）。

我确切地知道为什么会发生这种情况，但我需要使用什么功能才能实际刷新10个表？

由于

Answer 1

没有使用append（）替换成html（）函数使用解决了你的问题

  <div id="HTMLTABLE"></div>
 <script>
     $(document).ready(function(){

        refresh();
        });

        function refresh() {
        setTimeout( function() {
        dbupdates(); 
        refresh();
        }, 1500);
        }   

        function dbupdates(){
        $.ajax({
            url: 'fetchtest.php',
            type: 'get',
            dataType: 'JSON',
            success: function(response){
        // for loop to only write 10 
         var tr_str ='';
                for(var i=0; i<response.length; i++){
                    var id01 = response[i].id; 
                    var id02 = response[i].name;
                    var id03 = response[i].salery;
        // tr located in html
                     tr_str += "<tr>" +
                        "<td align='center'>" + id01 + "</td>" +
                        "<td align='center'>" + id02 + "</td>" +
                        "<td align='center'>" + id03 + "</td>" +
                        "</tr>";
        // table ID in html file

                }
             $("#HTMLTABLE").html(tr_str);

            }
        });
        };
 </script>

刷新AJAX函数（获取PHP）

1 个答案: