如何在用户不注意的情况下重新加载页面?

时间:2015-10-21 11:58:28

标签: javascript

我一直在试图弄清楚如何重新加载页面并从服务器提取动态信息,而用户不会注意到页面已经重新加载。例如,如果我想在每次其他人发表评论或发布消息时董事会更新时创建一个“实时”留言板系统。

我注意到Javascript有一个布尔函数.reload()当设置为false时从缓存重新加载页面,当设置为true时从服务器重新加载页面,但从它看起来像是,函数做了一些事情类似于重新加载浏览器。我还有其他办法吗?

3 个答案:

答案 0 :(得分:1)

像这样......

function getContent() 
{
    return new Promise(function(resolve, reject){

        var url = "http://yourendpoint.ext"
        $.ajax({
            url: url,  
            success: function(data) 
            {
                resolve(data); 
            },
            error: function(err)
            {
                reject(err);
            }
        });
    }));

}

// Usage
getContent()
.then(function(data)
{
    $('#some-element').html(data);
});

答案 1 :(得分:1)

您确定要真正重新加载吗?

您可以做的是向服务器发出AJAX请求并显示结果,甚至不重新加载页面。我建议使用jQuery,只是出于安慰。

AJAX代表异步JavaScript和XML 。以简单的方式,过程可以是:

  1. 用户显示页面,启动计时器
  2. 每10秒(或20秒或其他)使用JavaScript执行AJAX请求,向服务器请求新数据。您可以设置一个处理结果数据的回调函数。
  3. 服务器使用结果数据回答,您的回调函数会插入新数据。
  4. 代码示例(取自jQuery Docs):

    size=[140000,3504];
    filesize=0;
    datatype='float64';
    filename='my_array.dat';
    fid=fopen(filename,'w+');
    max_chunk_size=1000000;
    %fills an empty file
    while filesize<prod(size)
        to_write=min(prod(size)-filesize,max_chunk_size);
        filesize=filesize+fwrite(f, zeros(to_write,1), datatype);
    end   
    fclose(fid);
    m = memmapfile(filename,'Format','double', 'Writable',true);
    

    只需将服务器的正确端点设置为目标,然后在成功函数中插入您想要执行的操作。该函数将获得一个答案,其中包含您从服务器发送给它的任何内容。 jQuery文档中的更多信息:

答案 2 :(得分:1)

你可以使用AJAX实现你想要的东西。你可以使用javascript或jquery的ajax。您可以动态加载所需的内容,而无需重新加载整个页面。这是一个简单的例子。

以下是<div>,其ID为load,您的内容将会被加载。

  <div id="load">Loaded Content:</div>
  <button id="load_more">load more</button>

JQuery请求数据,其中getdata.php是将发送您想要显示的数据的php文件。

<script type="text/javascript">
$(document).ready(function(){
    $("#load_more").click(function (){
        $.post("getdata.php", {variable1:yourvariable, variable2:ifneeded},function(data){
        //data is the string or obj or array echoed from getdata.php file
        $('#load').append(data); //putting the data into the loaded div.
        }
     });
     });
    });
 </script>` 

最后getdata.php文件

<?php
  //fetch data from Databas eif needed. or echo ut what you want to display in the div.
 echo "This is a small example of using JQuery AJAX post request with PHP.";
?>

希望有所帮助!