jQuery setInterval更新PDO内容

我想运行一个jQuery脚本，每隔一段时间更新一次内容框。我希望这个盒子上的内容来自我的数据库。jQuery setInterval更新PDO内容

到目前为止，我有这个，这不是很多，但不知道如何最好的方式来取代内容。这就是我的方法，但我相信它是不正确的，还有更好的方法，但这也无济于事。

<div id="list"> List here </div> 

<script> 
    $(document).ready(function() { 
     setInterval(function(){ updateList(); }, 8000); 
    }); 
    function updateList(){ 

    $('#list').html(
     <?php 
      $sql = "SELECT * FROM list WHERE enable = 1 ORDER BY id DESC"; 
      $stm = $dbh->prepare($sql); 
      $stm->execute(); 
      $u = $stm->fetchAll(); 
      foreach ($u as $list) { 
       ?> 
       "<?php echo $list['name']; ?>"; 
       <?php 
      } ?> 
     ); 

    } 
</script>

我的问题是，我将如何能够做到这一点？由于

来源

2017-09-13 Jack Jacke

PHP只是一个预处理器。在将结果页面发送给客户端之前，您的PHP代码将在服务器上“执行”/解析一次。当你运行你的JS函数时，它不会刷新数据。你可能需要做的是使用[AJAX]（https://en.wikipedia.org/wiki/Ajax_（编程））和一个专门的PHP脚本来完成更新。 – Vivick

@Vivick谢谢你的回复。如果你可以展示如何通过ajax来做到这一点，是否有可能？ –

-1

尝试这个

var gtimer; 
$(document).ready(function() { 
    clearInterval(gtimer); 
    gtimer = window.setInterval(function() { 
     clearInterval(gtimer); 
     updateList(); 
    },8000); 
});

来源

2017-09-13 06:47:42

您需要执行调用PHP服务器端操作这样一个Ajax功能（带<ul><li>列表中显示separeted的所有元素，但可选）：

名单。 PHP

<?php 

    function get_list() { 
     $sql = "SELECT * FROM list WHERE enable = 1 ORDER BY id DESC"; 
     $stm = $dbh->prepare($sql); 
     $stm->execute(); 
     return $stm->fetchAll(); 
    } 

    if($_GET['update']) { 
     $html = '<ul>'; 
     foreach(get_list() as $element) { 
      $html. = '<li>'.$element['name'].'</li>'; 
     } 
     echo $html . '</ul>'; 
     die(); 
    } 

?><html> 
    <head> 
     <title>...</title> 
     Some css and js... 
    </head> 
    <body> 
     <div id="list"> 

     </div> 

     <script> 
      $(document).ready(function() { 
       setInterval(function(){ 
        $.get('list.php?update=1', function(data) { 
         $('#list').html(data); 
        }); 
       }, 8000); 
      }); 
     </script> 
    </body> 
</html>

来源

2017-09-13 07:28:44 Meloman

正如我在评论中指出：

PHP只是一个预处理

因此，我建议使用AJAX和一个分离PHP脚本来完成这项工作（和<ul>）：

getEnabledsNames.php

<?php 
    $sql = "SELECT * FROM list WHERE enable = 1 ORDER BY id DESC"; 
    $stm = $dbh->prepare($sql); 
    $stm->execute(); 
    $u = $stm->fetchAll(); 
    $u = array_map(function($elem){ 
    return $elem['name']; 
    }, $u); 

    header('Content-Type: application/json'); 
    echo json_encode($u); 
?>

JS代码

let interval; 
$(document).ready(()=>{ 
    interval = setInterval(updateFromDb, 8000); 
}); 

function updateFromDb(){ 
    $.get(
    "getEnabledsNames.php", 
    (data)=>{ 
     $("#list > ul").html(""); 
     data.forEach(e=>{ 
     $("#list > ul").append(`<li>${e}</li>`); 
     }); 
    } 
).fail(/* function to handle failure here */); 
}

的HTML

<div id="list"> 
    <ul></ul> 
</div>

来源

2017-09-13 17:44:34 Vivick

jQuery setInterval更新PDO内容

回答

相关问题