ファイルからデータを読み取るX秒ごとにdivを更新するにはどうすればよいですか？

debugcn 投稿 Dev

デビッドトッド

下のindex.phpページで数秒ごとにdivを更新する必要があります。

<?php

session_start();

if (! check_write()) {
    redirect('testlogin.php');
    return;
}

if (file_exists('lmt.json')) {
    $lmt = json_decode(file_get_contents("lmt.json"), true);
}

?>
<!doctype html>
<html lang="en">

<head>
    <title>Home</title>
</head>

<body>
    <div>
        <h1>Website Title</h1> <a href="logout.php">Logout</a> </div>
    <div>
        <p>Welcome back,
            <?= $_SESSION['user_id'] ?>!</p>
    </div>
    <!-- How can I refresh below div every x seconds? -->
    <div>
        <?php if (isset($lmt)) { ?>
            <p>Last modified by <?= $lmt['fname']; ?> at <?= $lmt['ts']; ?></p>
        <?php } ?>
    </div>
    <form method="post">
        <input type="text" name="field1" />
        <input type="text" name="field2" />
        <input type="submit" name="submit" value="Save Data"> </form>
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    <script>
    $(function() {
        $('form').submit(function(e) {
            e.preventDefault();
            $.post({
                url: 'save.php',
                data: $(this).serialize(),
            }).done(response => {
                response = JSON.parse(response);
                if(response.message) {
                    alert(response.message);
                }
            });
        });
    });
    </script>
</body>
</html>

以下は、X秒ごとに更新したいdivです。今のところそれはちょうどから値を取得し$lmt、変数と、それをユーザーに表示しますが、私はから読み取ることによって、そのdiv要素ごとにX秒をリフレッシュしたいlmt.jsonファイルを、次に示しfnameおよびts変数。

<!-- How can I refresh below div every x seconds? -->
<div>
    <?php if (isset($lmt)) { ?>
        <p>Last modified by <?= $lmt['fname']; ?> at <?= $lmt['ts']; ?></p>
    <?php } ?>
</div>

どうすればこれを効率的に行うことができますか？

ディネッシュ

2つの別々のファイルindex.php（更新するdivが含まれています）とfilehandle.php（受け取る必要のあるファイルの内容）を書き込みます。

index.php

<?php

session_start();

if (! check_write()) {
    redirect('testlogin.php');
    return;
}

?>
<!doctype html>
<html lang="en">

<head>
    <title>Home</title>
</head>

<body>
    <div>
        <h1>Website Title</h1> <a href="logout.php">Logout</a> </div>
    <div>
        <p>Welcome back,
            <?= $_SESSION['user_id'] ?>!</p>
    </div>
    <!-- How can I refresh below div every x seconds? -->
    <div class="update_content"></div>

    <form method="post">
        <input type="text" name="field1" />
        <input type="text" name="field2" />
        <input type="submit" name="submit" value="Save Data"> </form>
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    <script>

    var update_time = 1000;
    $.get('filehandle.php', function (data, status){
        $('.update_content').html(data);
    });
    setInterval(function(){
        $.get('filehandle.php', function (data, status){
            $('.update_content').html(data);
        });
    }, update_time);

    $(function() {
        $('form').submit(function(e) {
            e.preventDefault();
            $.post({
                url: 'save.php',
                data: $(this).serialize(),
            }).done(response => {
                response = JSON.parse(response);
                if(response.message) {
                    alert(response.message);
                }
            });
        });
    });
    </script>
</body>
</html>

filehandle.php

<?php

if (file_exists('lmt.json')) {
    $lmt = json_decode(file_get_contents("lmt.json"), true);
}

if (isset($lmt)) {
    echo "<p>Last modified by ".$lmt['fname']." at ".$lmt['ts']."</p>";
}

?>

値のupdate_time値をindex.php目的の値に変更します（毎秒更新することを意味しますupdate_time）。