php - json-php-mysql-jquery-ajax 如何在不刷新的情况下更新

Question

我有下面的例子。

---

用户 View .php

<script>
        $(document).on("ready", function(){
            loadData();
        }); 

        var loadData = function(){
            $.ajax({
                type:"POST",
                url:"Users.php"
            }).done(function(data){
                console.log(data);
                var users = JSON.parse(data);
                for(var i in users){
                    $("#content").append(users[ i ].usuario + " " + users[ i ].nombres + "<br>");
                }
            });
        }

    </script>

用户.php

  <?php
    $bd = "test";
    $server ="localhost";
    $user = "root";
    $password = "";

    $conexion = @mysqli_connect($server, $user, $password, $bd);

    if( ! $conexion )   die( "Error de conexion ".mysqli_connect_error() );

    $sql = "SELECT usuario, nombres FROM usuario";
    $result = mysqli_query($conexion, $sql);
    $array_user = array();
    while($data = mysqli_fetch_assoc($result)){
        $array_user[] = $data;
    }

    echo json_encode($array_user);
?>

如何在不刷新页面的情况下在 userview.php 中重新加载用户(在更新或删除的情况下)

Answer 1

一个解决方案是让 loadData() 运行，比方说，每 5 秒运行一次，即:

<script>
$(document).ready(function() {
    startLoop();
});

var frequency = 5000; // 5 seconds in miliseconds
var interval = 0;
// STARTS and Resets the loop
function startLoop() {
    if (interval > 0) clearInterval(interval); // stop
    interval = setInterval("loadData()", frequency); // run
}

function loadData() {
    $.ajax({
        type: "POST",
        url: "Users.php"
    }).done(function(data) {
        console.log(data);
        var users = JSON.parse(data);
        $("#content").empty();
        for (var i in users) {
            $("#content").append(users[i].usuario + " " + users[i].nombres + "<br>");
        }
    });
}
</script>