php jquery刷新div

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/18061428/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-25 16:54:23  来源:igfitidea点击:

Jquery refresh div

phpjavascriptjquerysettimeout

提问by Jaskaran Singh Puri

I've got a certain php code in a div which gets data from mysql.I want this div to refresh every minute without refreshing the entire page.

我在一个 div 中有一个特定的 php 代码,它从 mysql.I 获取数据。我希望这个 div 每分钟刷新一次而不刷新整个页面。

Currently I'm using this, doesn't work well

目前我正在使用这个,效果不佳

<div id="abc">
<?php

?>
</div>

window.setTimeout('location.reload()', 60000);

回答by Justin Ethier

The ideal way to do this is to use jQuery.ajax to retrieve data from your server, and then use JavaScript/jQuery within your successfunction to update your page.

执行此操作的理想方法是使用jQuery.ajax 从您的服务器检索数据,然后在您的success函数中使用 JavaScript/jQuery来更新您的页面。

You can still use setTimeoutor equivalent to periodically issue AJAX requests.

您仍然可以使用setTimeout或等效于定期发出 AJAX 请求。

回答by Ayyappan Sekar

As you want to refresh the div content every minute you need to look at setIntervalmethod and loadof jQuery:

由于您想每分钟刷新一次 div 内容,您需要查看setInterval方法和jQuery 的加载

window.setInterval(function(){
  $('#abc').load('PHPFile.php');
}, 1000);

and your PHP script mentioned in the url part of the load method must be capable to provide the result in HTML format which is going to be placed in the given div (id:abc)

并且您在 load 方法的 url 部分中提到的 PHP 脚本必须能够以 HTML 格式提供结果,该结果将放置在给定的 div (id:abc) 中

回答by Magnus Burton

Have the PHP-code on another page (for example; loaddata.php) and have a jQuery timer executing a function which loads the page loaddata.php

将 PHP 代码放在另一个页面上(例如;loaddata.php),并让 jQuery 计时器执行加载页面loaddata.php的函数

Loaddata.php

加载数据文件

<?php
    echo "Hello World!";    
?>

index.php

索引.php

<div id="data"></div>

<script>
    $('#div').load("loaddata.php", function() {
        window.setInterval("loadData", 60000);
    });

    function loadData()
    {
        $('#div').load("loaddata.php");
    }
</script>

回答by Mike Thomsen

Something like this:

像这样的东西:

function refreshContent() {
    $.post(urlHere, { data here...}, success(data) {
        //...manipulate DOM here...
    }
}

setTimeout(refreshContent, 60000);

回答by M1K1O

Example of jQuery Ajax

jQuery Ajax 示例

file1.php

文件1.php

<?php
  echo 'PHP content e.g. from database based on submitted request - '.$_POST['my-value'];
?>

file2.html

文件2.html

<div class="content"></div>
<a href="#" class="reload-data"> Refresh div </a>

<script>
$(function(){
  $(".reload-data").click(function(){
    $.post("file1.php", {my-value: "something"}, function(data){
      $(".content").html(data);
    });
  });
});
setTimeout(function(){$(".reload-data").click();}, 60000);
</script>

回答by Vlad Preda

For these situations I sometimes use jQuery.load()

对于这些情况,我有时会使用jQuery.load()

Example from documentation:

文档中的示例:

<div id="result"></div>
<script type="text/javascript">
function refreshDiv() {
    $('#result').load('ajax/test.html #container', function(){ /* callback code here */ });
}
setInterval(refreshDiv, 10000);
</script>

This does the following:

这将执行以下操作:

  • Checks if the #resultelement is in the current page
  • If it is, it makes a request to the ajax/test.htmlpage
  • Grabs the #containerfrom the response, and dumps it into #result
  • And it does this every 10 seconds
  • 检查#result元素是否在当前页面
  • 如果是,则向ajax/test.html页面发出请求
  • 抓住#container从响应,并转储到#result
  • 它每 10 秒执行一次

That's about it. One line of code, although not as efficient as a true ajax request, it does the job.

就是这样。一行代码,虽然不如真正的 ajax 请求高效,但它可以完成工作。