Question

我正在尝试从mysql表中获取详细信息并使用ajax显示它。我已成功显示我的记录，但似乎记录正在循环显示。例如：正在显示从1到10的数字，一旦完成10的列表，将再次显示从1到10的数字。我找不到我错的地方。

的Javascript

<script type="text/javascript">
$(function(){
    setInterval(function(){
        $.ajax({
            url: 'details.php',
            success: function(data){
                var response=JSON.parse(data);
                var no=1;

                $(function(){
                    $.each(response, function(i, item){
                        var change = no % 2;
                        if(change === 0){
                            $('<tr>').append(
                                $('<td>').text(item.memo).addClass('table1'),
                                $('<td>').text(item.pid).addClass('table1'),
                                $('<td>').text(item.qty).addClass('table1'),
                                $('<td>').text(item.amt).addClass('table1')
                            ).appendTo('#Table1');
                        }
                        else{
                            $('<tr>').append(
                                $('<td>').text(item.memo).addClass('table2'),
                                $('<td>').text(item.pid).addClass('table2'),
                                $('<td>').text(item.qty).addClass('table2'),
                                $('<td>').text(item.amt).addClass('table2')
                            ).appendTo('#Table1');
                        }
                        no = no+1;
                    });
                });
            }
        });
    }, 1000);
});
</script>

PHP

<?php
include 'connect.php';
$timestamp = "";
$return = array();
$response = "";
$sql = "SELECT * FROM receipts ORDER BY timestamp DESC LIMIT 1";
$result1 = mysqli_query($db, $sql);
if($details = mysqli_fetch_array($result1)){
    $timestamp = $details['timestamp'];
}

$sql = "SELECT * FROM sales WHERE timestamp>'$timestamp'";
$result = mysqli_query($db, $sql);
while($fetch_options=mysqli_fetch_array($result)){
    $return[]=array('memo'=>$fetch_options['memo'], 'pid'=>$fetch_options['pid'], 'qty'=>$fetch_options['qty'], 'amt'=>$fetch_options['amt']);
}
$response = $return;
echo json_encode($response);
?>

HTML

     <table width="300" id="Table1" name="Table1">
     <tr>
        <th width="68" id="wb_uid0"><div class="CustomStyle"><span id="wb_uid1"><strong> Memo</strong></span></div>
        </th>
        <th width="64" id="wb_uid2"><div><span id="wb_uid3"><strong> Product ID</strong></span></div>
        </th>
        <th width="50" id="wb_uid4"><div><span id="wb_uid5"><strong> Qty</strong></span></div>
        </th>
        <th width="88" id="wb_uid6"><div><span id="wb_uid7"><strong> Amount</strong></span></div>
        </th>
     </tr>
     </table>

Answer 1

你可以这样尝试

改变JS

<script type="text/javascript">
$(function(){
     setInterval(function(){
    $.ajax({
        url: 'details.php',
        success: function(data){

            $('#Table1').find('#appendRow').remove();
            var response=JSON.parse(data);
            var no=1;

                $.each(response, function(i, item){
                    var change = no % 2;
                    if(change === 0){
                        $('<tr id="appendRow">').append(
                            $('<td>').text(item.memo).addClass('table1'),
                            $('<td>').text(item.pid).addClass('table1'),
                            $('<td>').text(item.qty).addClass('table1'),
                            $('<td>').text(item.amt).addClass('table1')
                        ).appendTo('#Table1');
                    }
                    else{
                        $('<tr id="appendRow">').append(
                            $('<td>').text(item.memo).addClass('table2'),
                            $('<td>').text(item.pid).addClass('table2'),
                            $('<td>').text(item.qty).addClass('table2'),
                            $('<td>').text(item.amt).addClass('table2')
                        ).appendTo('#Table1');
                    }
                    no = no+1;
            });
        }
    });
}, 1000);
});
</script>

我不确定但我觉得它对你有帮助。

Answer 2

上一个答案是正确的问题是这一行： $（＆＃39;＃Table1＆＃39;）。children（）。remove（）;
删除所有表子项，包括标题。这就是为什么当你追加内容时它们会丢失的原因。

修改

mysql数据被多次显示

2 个答案: