AJAX setinterval()函数重复了我的html?

时间:2017-05-06 12:49:48

标签: php jquery html ajax

我创建了一个表,其中每10秒使用数据库查询数据刷新一个文本框,但每次执行该函数时,它都会复制我现有的html代码。这是以前的after图片

我的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']
 
?>
&#13;
&#13;
&#13;

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

 <body>
  <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>
	<tr>
		<td>Selecionar posto de atendimento:</td>
		<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>
	</tr>
	<tr>
		<td colspan="2"><input type="submit" form="atender" name="atender" value="Atender Cliente Seguinte"></td>
	</tr>
	</table>
  </form>
 </body>
</html>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

好像你的bt1admin.php文件正在返回整个页面而不仅仅是数字。您可以创建单独的文件,仅用于检索数据或执行类似的操作:

&#13;
&#13;
$(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();
});
&#13;
<?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>
&#13;
&#13;
&#13;