无需重新加载页面即可刷新javascript计算

时间:2013-04-20 05:53:14

标签: php javascript jquery

我有一个提交按钮,它使用javascript xmlhttp请求调用一个php页面,其唯一的功能是在我的主页面上为google地球窗口写一个kml文件。 php页面在Web浏览器中无法以html格式显示。

php文件中的公式按预期工作。我遇到的问题是,在我第一次手动按提交后,我希望脚本继续每5秒重复一次,直到我手动重新加载页面(或按下按钮停止脚本)。因为我计划在查看页面的同时让多个用户为每个用户分配一个随机的5位数字来保存他们的会话信息,并在新创建的会话文件夹中创建kml文件,直到他们重新加载页面(然后创建该页面)用户的新会话号。)

因为每个用户都被指定了唯一的会话ID,所以当php计算重复时,页面无法重新加载。因此我在javascript函数的末尾有一个返回假行。

我希望能够使用javascript调用setInterval来重复该函数而无需重新加载页面。如果页面要重新加载,则刚创建的kml文件现在将无法在新会话中查看。如果有人有任何建议,请告诉我。以下是适用的代码。

主索引.php页面上的DIV id

<div>
  <form id="KMLsubmit" name=KMLsubmit >
    <input class="KMLsubmit" type="submit" value="Create KML" onclick="createKML()"/>
  </form>
</div> 

主要index.php页面上的JavaScript函数

function createKML() {
    $('#KMLsubmit').submit(function () {
        $.get("generateKML.php",function(data,status){
        });
        //alert("Generating your KML files!");
        if (window.XMLHttpRequest)
        {// code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp=new XMLHttpRequest();
        }
        else
        {// code for IE6, IE5
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function()
        {
            if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
                document.getElementById("kmldetails").innerHTML=xmlhttp.responseText;
            }
        }
  xmlhttp.open("POST","generateKML.php?session=" + session,true);
  xmlhttp.send();
  return false; 
    });
  }

如果有人对如何执行此操作有任何建议,请告诉我。谢谢你的帮助。

2 个答案:

答案 0 :(得分:0)

尝试

$(function(){
    $('#KMLsubmit').submit(function () {
        $.get("generateKML.php",function(data,status){
        });

        update();

        return false; 
    });

    function update(){
        $.ajax({
            url: 'generateKML.php',
            data: {
                session: session
            }
        }).done(function(result){
            $('#kmldetails').html(result);

            setTimeout(update, 5000)
        });
    }
})

答案 1 :(得分:0)

make createKML() external,在KMLsubmit提交事件上调用它,设置5秒的超时功能并清除下一个submition的超时,然后重启这个过程:

var myTimer = false;

function createKML() {
    var xmlhttp = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
    xmlhttp.onreadystatechange = function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("kmldetails").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("POST", "generateKML.php", true);
    xmlhttp.send("session=" + session);
    myTimer = setTimeout(function(){createKML()}, 5000);
}

document.getElementById('KMLsubmit').onsubmit = function(event){
    (event.preventDefault) ? event.preventDefault() : event.returnValue = false; //prevent the form from submitting and reloading the page
    if(myTimer) clearTimeout(myTimer);
    createKML();
}