0

所以我有一个倒计时计时器，它在时钟达到 0 时抓取一个 .php 文件。唯一的问题是，php 文件正在新窗口中打开。我希望它以某种方式显示在页面底部。

我对javascript或AJAX一无所知。只有php和html。谁能告诉新手该怎么做？

<!--START COUNTDOWN TIMER SCRIPT-->
                          <br>
                          <script type="text/javascript">

                          window.onload = function() {
countDown('my_div1', 'timerunout.php', 4); } function countDown(elID, output, seconds) {
var elem = document.getElementById(elID),
    start = new Date().getTime(), end = start+seconds*1000,
    timer = setInterval(function() {
        var now = new Date().getTime(), timeleft = end-now, timeparts;
        if( timeleft < 0) {
            document.location.href = output;
            clearInterval(timer);
        }
        else {
            timeparts = [Math.floor(timeleft/60000),Math.floor(timeleft/1000)%60];
            if( timeparts[1] < 10) timeparts[1] = "0"+timeparts[1];
            elem.innerHTML = "When the Clock hits Zero...<br> "+timeparts[0]+":"+timeparts[1];
        }
    },250); // the lower this number, the more accurate the timer. 250 recommended }

                          </script>


                          <center>
                          <font color="#FF0000"><b><h1>
                          <div id="my_div1">
                          </div>
                          </h1></b></font>
                          </center>
                          <!--END COUNTDOWN TIMER SCRIPT-->

好的，所以我在 index.php 上有一个倒数计时器，当它达到 0 时...它使用 AJAX 在页面底部打开另一个 php 文件。我们称之为timerunout.php

问题是...在那个 PHP 文件是一个链接。在该链接的末尾需要附加一个附属 ID。

只有当有人在 index.php 的地址末尾键入他们的用户名时，才会检测到该会员 ID。有什么建议么？

这是 index.php 的代码


window.onload = function() { countDown('my_div1', 'timerunout.php', 4); }

function countDown(elID, output, seconds) {
    var elem = document.getElementById(elID);
    start = new Date().getTime(), end = start+seconds*1000,
    timer = setInterval(function() {
        var now = new Date().getTime(), timeleft = end-now, timeparts;
        if( timeleft < 0) {
            //This code creates the AJAX object, which will then be used to send it.
            var xmlhttp;
            if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp=new XMLHttpRequest();
            } else {// code for IE6, IE5
                xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
            }

            //This code parameterizes the object to point at your page in an asynchronous way.
            xmlhttp.open("GET","timerunout.php?s1=username",true);
            xmlhttp.send(); //Once all parameters are set, send it on it's way.


            //Callback. Once the request is in one of it's stages, this will be called.
            xmlhttp.onreadystatechange=function() {
                //Request done and fetching the page successful?
                if (xmlhttp.readyState==4 && xmlhttp.status==200) {
                    //Sets the HTML of my_div1 to whatever was in timerunout.php
                    elem.innerHTML=xmlhttp.responseText;
                }
            }
            clearInterval(timer);
        } else {
            timeparts = [Math.floor(timeleft/60000),Math.floor(timeleft/1000)%60];
            if( timeparts[1] < 10) timeparts[1] = "0"+timeparts[1];
            elem.innerHTML = "When the Clock hits Zero...<br> "+timeparts[0]+":"+timeparts[1];
        }
    } ,250); // the lower this number, the more accurate the timer. 250 recommended  } </script> <center>
    <div id="my_div1"></div> </center> <!--END COUNTDOWN TIMER SCRIPT-->

这是timerunout.php

    //
    // Maybe check $s1 is indeed valid
    //

    $newurl = sprintf('/join.php?id=%s', urlencode($_GET['s1']));
    $coaching = sprintf('/live/webinar-register.php?id=%s',

urlencode($_GET['s1'])); ?>

所以基本上我要说的是，在 index.php 中，username这一行需要来自用户在地址栏中输入的内容。

xmlhttp.open("GET","timerunout.php?s1=username",true);
4

1 回答 1

2

如果你想使用 jQuery-Framework，你可以这样处理：

$.ajax({
    url: "timerunout.php",
    data:{ s1:"whateverparametersuitsyourfancy" }
}).done(function(data) {
    $('#my_div1').html(data);
});

如果你想走传统的方式，AJAX 调用会稍微复杂一些。来自 w3schools 网站：

//This code creates the AJAX object, which will then be used to send it.
var xmlhttp;
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
} else {// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

//This code parameterizes the object to point at your page in an asynchronous way.
xmlhttp.open("GET","timerunout.php?s1=whateverparametersuitsyourfancy",true);
xmlhttp.send(); //Once all parameters are set, send it on it's way.


//Callback. Once the request is in one of it's stages, this will be called.
xmlhttp.onreadystatechange=function() {
    //Request done and fetching the page successful?
    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
        //Sets the HTML of my_div1 to whatever was in timerunout.php
        document.getElementById("my_div1").innerHTML=xmlhttp.responseText;
    }
}

两个代码都会向相关页面发送 GET 请求，并将目标页面的“回显”输出写入由“my_div1”标识的 html 标记。

在您的代码中（我将使用普通的 JS 示例），这可能看起来像这样。

<!--START COUNTDOWN TIMER SCRIPT-->
<br>
<script type="text/javascript">
    window.onload = function() { 
        countDown('my_div1', 'timerunout.php', 4); 
    } 

    function countDown(elID, output, seconds) {
        var elem = document.getElementById(elID);
        start = new Date().getTime(), end = start+seconds*1000,
        timer = setInterval(function() {
            var now = new Date().getTime(), timeleft = end-now, timeparts;
            if( timeleft < 0) {
                //This code creates the AJAX object, which will then be used to send it.
                var xmlhttp;
                if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
                    xmlhttp=new XMLHttpRequest();
                } else {// code for IE6, IE5
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                }

                //This code parameterizes the object to point at your page in an asynchronous way.
                xmlhttp.open("GET","timerunout.php?s1=whateverparametersuitsyourfancy",true);
                xmlhttp.send(); //Once all parameters are set, send it on it's way.


                //Callback. Once the request is in one of it's stages, this will be called.
                xmlhttp.onreadystatechange=function() {
                    //Request done and fetching the page successful?
                    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
                        //Sets the HTML of my_div1 to whatever was in timerunout.php
                        elem.innerHTML=xmlhttp.responseText;
                    }
                }
                clearInterval(timer);
            } else {
                timeparts = [Math.floor(timeleft/60000),Math.floor(timeleft/1000)%60];
                if( timeparts[1] < 10) timeparts[1] = "0"+timeparts[1];
                elem.innerHTML = "When the Clock hits Zero...<br> "+timeparts[0]+":"+timeparts[1];
            }
        } ,250); // the lower this number, the more accurate the timer. 250 recommended 
}
</script>
<center>
    <font color="#FF0000"><b><h1>
        <div id="my_div1"></div>
    </h1></b></font>
</center>
<!--END COUNTDOWN TIMER SCRIPT-->

编辑：我在 AJAX 调用中添加了一个 GET 参数，以方便您使用。

于 2013-03-03T09:25:48.287 回答