当前位置: 代码迷 >> JavaScript >> 使用setvalue运行循环
  详细解决方案

使用setvalue运行循环

热度:74   发布时间:2023-06-03 17:51:18.0

HTML:

<section class="clientbox">
    <div class="container">
        <div class="col-lg-10 col-lg-offset-1">
            <h2>WHAT CLIENT SAYS</h2>
            <h4>POSITIVE REVIEWS FOR LOVING PROBLAM.COM </h4>
            <p id="testimonial"><?php echo $alldata[0]['text'] ?></p>
         </div>
    </div>    
</section>

JavaScript的:

<script type="text/javascript">
<?php $i = 1; ?>
    setInterval(function()
        {
            document.getElementById('testimonial').innerHTML = "<?php echo $alldata[$i]['text'] ?>";
            <?php $i++; ?>
        }, 3000);

我实际上想做的是每3秒钟从存储在$alldata数组中的值更改“证明”文本。

问题是php变量$i没有得到更新。 它仅保留1。

您不能像这样混合使用PHP和Javascript。 PHP首先运行,生成一些数据供Javascript解释。 从Javascript的角度来看,它只能看到以下内容:

<script type="text/javascript">
    setInterval(function()
        {
            document.getElementById('testimonial').innerHTML = "some data";
        }, 3000);
</script>

您将需要将所有数据传递给Javascript,以便可以对其进行迭代。

您将服务器端逻辑(PHP)与客户端逻辑(JavaScript)混合在一起。

当客户端请求您的网页时,PHP将呈现包含HTML,CSS,JavaScript和其他内容的内容,然后Web服务器会将这些内容发送到客户端。

Web浏览器接收这些内容,然后执行JavaScript并根据样式呈现HTML。

您需要在服务器端生成JavaScript setInterval所需的所有内容,并调整JavaScript逻辑以对这些数据进行迭代。

逻辑可能如下所示。 我不熟悉PHP,不确定这是否有效。 JavaScript不会检查是否所有数据都已使用。

<script type="text/javascript">
    <?php
    function get_data($e) {
        return($e['text']);
    }
    $data = array_map("get_data", $alldata);
    ?>
    var js_alldata = <?php echo json_encode($data) ?>;
    var i = 1;
    setInterval(function()
        {
            document.getElementById('testimonial').innerHTML = js_alldata[i % js_alldata.length];
            i++;
        }, 3000);

我已经编写了此代码,并且可以正常工作。 正如上面的人告诉您的那样,服务器端无法使用客户端迭代或setIntervals,因此您应该事先发送全部数据。

例:

$array = array();
$array[0]['text'] = 'hi';
$array[1]['text'] = 'hey';
$array[2]['text'] = 'hou';
$js_array = json_encode($array);

?>

<p id="testimonial"><?php echo $array[0]['text'] ?></p>

<script>
    var json;
    var i=1;

    json = <?php echo $js_array; ?>

    setInterval(function()
    {
        document.getElementById('testimonial').innerHTML = json[i]['text'];
        i++;
    }, 3000);
    console.log(json);
</script>