Question

我正在使用PHP和jQuery / JavaScript处理PHP购物车计时器脚本。

我每秒都会迭代set-interval函数来获取PHP的当前时间戳。

当第一个产品添加到购物车时，计时器在获取计时器之前开始 - 停止它会提示用户，用户是想继续还是取消。

我的代码如下

$(document).ready(function(){
    var orderedtime = "echo $_SESSION['ordertime'];";
    if (orderedtime === null || orderedtime == ''){
       console.log("orderedtime is not set");
    }
    else{
       init();
   }
});
var currenttime;
var alerttime;
var extratime;
function cd(){
    alerttime = "<?php echo date('h:i:s', (strtotime($_SESSION['ordertime']) + (1 * 60)));  ?>"
    extratime = "<?php echo date('h:i:s', (strtotime($_SESSION['ordertime']) + (2 * 60)));  ?>";
    redo();
}
function redo(){
    currenttime = "<?php echo date('h:i:s', time()); ?>";
    if(alerttime == currenttime) {
        //doing something   
    }
    else if(currenttime == extratime){
        //doing something
    }
    else{
        cd = setTimeout("redo()",1000);
    }
}
function init(){
    cd();
}

仅存储第一个迭代值的currenttime变量没有得到更新。

如何解决这个问题？

请帮助我解决。

提前致谢。

Answer 1

您实际上并没有在setTimeout循环中从服务器请求时间。

这一行

currenttime = "<?php echo date('h:i:s', time()); ?>";

首次生成页面时不会再次更改

。如果您希望更新时间，则需要向服务器发送请求。这可能不是最好的方法。

Answer 2

除了MikeW优秀但不完整的答案之外，您还需要一种从服务器请求时间并在DOM中接收它的方法。

只有一种方法可以做到：AJAX。

正如Mike指出的那样，您在上面输入的PHP代码只运行一次：首次生成页面时。生成页面并且文档“准备就绪”后，您必须使用AJAX。

下面是一个完整的，复制/可管理的示例，以演示一种可行的方法。

请注意，我必须覆盖orderedtime变量，因为我不知道如何/何时设置它。

HTML / javascript端： index.php

<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
        <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
        <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />

        <style>
            #timeDiv{width:40%;height:200px;background:wheat;padding:10px;}
        </style>

        <script type="text/javascript">
            $(document).ready(function() {
                //var orderedtime = "<?php echo $_SESSION['ordertime']; ?>";
                var orderedtime = '';
                if (orderedtime === null || orderedtime == ''){
                   console.log("orderedtime is not set");
                }else{
                    doAjax();
                }

                window.setInterval(function(){
                    doAjax();
                },2000);

            }); //END document.ready

            function doAjax() {
                $.ajax({
                    type: "POST",
                    url: "get_the_time.php",
                    data: "ordertime=" + orderedtime,
                    success: function(myData) {
                        $('#thetime').html(myData);
                    }
                });
            }

        </script>
    </head>

<body>

    <div id="timeDiv">
        The time is: <span id="thetime"></span>
    </div>

</body>

</html>

PHP方面： get_the_time.php

<?php

if (isset($_POST['ordertime']) != true) {

    $d = date("h:i:s");

}else{

    $ot = $_POST['ordertime'];
    $d = date('h:i:s', (strtotime($ot) + (1 * 60)));

}

echo $d;

重要提示：

使用AJAX时，服务器发送的响应是在success:函数 中收到的，而在其他地方没有。

如果您以后希望使用该数据，则将其分配到成功函数内的变量将不起作用。我发现的最好的方法是将接收的数据粘贴到某种元素中（隐藏的输入字段对此很有用），然后在需要时从那里检索它。

例如：

<input type="hidden" id="myHiddenField" />

$.ajax({
    type: "POST",
    url: "get_the_time.php",
    data: "ordertime=" + orderedtime,
    success: function(myData) {
        $('#thetime').html(myData);
        $('#myHiddenField').val(myData);
    }
});

然后，在其他一些javascript函数中，您可以获取该数据并将其分配给某个变量，因此：

var someVar = $('#myHiddenField').val();

希望这会有所帮助，迟到。

This stackoverflow post 有关于AJAX的进一步信息/解释。查看底部的简化AJAX示例。

如何使用jquery / javascript每秒更新PHP当前时间戳

2 个答案: