AJAX setinterval（）函數重複我的html？

我創建了一個表格，其中一個文本框每10秒刷新一次數據庫查詢數據，但每次執行該函數時，都會複製我現有的html代碼。這裏有一個前後after圖片AJAX setinterval（）函數重複我的html？

而我的HTML：編輯：PHP太：

<?php 
 

 
include '../Login/db_login.php'; 
 
$page="bt1admin.php"; 
 
session_start(); 
 

 
$sql = "SELECT Contador FROM senhas2 WHERE ID=1"; 
 
$result = $conn->query($sql); 
 
$row = $result->fetch_assoc(); 
 
$nome = $row['Contador'] 
 
    
 
?>

<!doctype html> 
 
<html> 
 
<head> 
 
\t <meta charset="utf-8"> 
 
\t <title>Página de administração - A</title> 
 
\t <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
\t \t <script> 
 
\t \t \t setInterval(function(){ 
 
\t \t \t $('#refreshtb').load('bt1admin.php'); 
 
\t \t \t }, 10000) 
 
\t \t </script> 
 
</head> 
 

 
<body> 
 
    <form action="" id="atender" method="POST"> 
 
\t <table border="1"> 
 
\t <tr> 
 
\t \t <td>Clientes em espera:</td> 
 
\t \t <td><label id="refreshtb"><?php echo "$nome";?></label></td> 
 
\t </tr> 
 
\t <tr> 
 
\t \t <td>Selecionar posto de atendimento:</td> 
 
\t \t <td><select name="posto"><option value="n1" selected>1</option><option value="n2">2</option><option value="n3">3</option><option value="n4">4</option><option value="n5">5</option><option value="n6">6</option></select></td> 
 
\t </tr> 
 
\t <tr> 
 
\t \t <td colspan="2"><input type="submit" form="atender" name="atender" value="Atender Cliente Seguinte"></td> 
 
\t </tr> 
 
\t </table> 
 
    </form> 
 
</body> 
 
</html>

來源

2017-05-06 Azazel

你確定你想這個內容更新成''如圖所示？當然好像你是針對錯誤的元素 – charlietfl

最初它是一個輸入類型=文本，但嘗試各種不同的解決方案後，是我試過的最後一個。我只是希望它能正常刷新而不會重複我的表格，如果它是標籤/文本框/無論什麼都無關緊要，因爲我可以很容易地刪除背景或邊框。 – Azazel

那麼'bt1admin.php'返回什麼？看起來好像是整桌不是嗎？如果是這樣，重新加載表單元素 – charlietfl

好像你bt1admin.php文件被退回整個頁面而不僅僅是數字。你可以只用於檢索數據創建單獨的文件或做這樣的事情：

$(function() { 
 
    var Main = { 
 
    onDataSuccess: function(data) { 
 
     if (data.success) { 
 
     $('#refreshtb').text(data.numberOfAttendees); 
 
     console.log('Last fetched:', data.now); 
 
     } 
 
    }, 
 
    onDataError: function() { 
 
     console.log('error'); 
 
    }, 
 
    onDataAlways: function() { 
 
     setTimeout(Main.fetchData, 10000); 
 
    }, 
 
    fetchData: function() { 
 
     $.getJSON('bt1admin.php?ajax') 
 
     .done(Main.onDataSuccess) 
 
     .fail(Main.onDataError) 
 
     .always(Main.onDataAlways); 
 
    } 
 
    } 
 

 
    Main.fetchData(); 
 
});

<?php 
 
    // this should be at the beginning of your PHP file 
 
    // before anything is send to the browser 
 
    /* ... */ 
 
    
 
    if (isset($_GET['ajax'])) { 
 
    echo json_encode(array(
 
     'numberOfAttendees' => $nome, 
 
     'now' => date('H:i:s'), 
 
     'success' => true 
 
    )); 
 
    die; 
 
    } 
 
?> 
 

 
    <!-- ... --> 
 
    <form action="" id="atender" method="POST"> 
 
    <table border="1"> 
 
     <tr> 
 
     <td>Clientes em espera:</td> 
 
     <td><label id="refreshtb"><?php echo "$nome"; ?></label></td> 
 
     </tr> 
 
     <!-- ... --> 
 
    </table> 
 
    </form> 
 
    <!-- ... --> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

來源

2017-05-06 13:10:53

非常感謝輸入，但我無法真正理解此代碼。我已將它放在我的代碼上，但控制檯每10秒顯示一次並顯示錯誤輸出。所以它每10次刷新一次，但不會轉發數據，我猜...我還用我已有的PHP更新了我的原始文章 – Azazel

AJAX setinterval（）函數重複我的html？

回答

相關問題