8

我有一个 div 标签，它有一个 php 包含来用我想要做的信息填充该 div，以便每 15 秒调用一次页面，这样它就可以在那里更新信息，而无需重新加载整个网页。我试过用 JavaScript/jQuery 来做这件事，但我似乎无法让它工作

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
<script type="text/javascript">
var auto_refresh = setInterval(
function ()
{
$('.View').load('Small.php').fadeIn("slow");
}, 15000); // refresh every 15000 milliseconds
</script>

<div class="View"><?php include 'Small.php'; ?></div>

这是我在搜索后得到的，发生的事情是，它加载了 Small.php 但它不会刷新它或每 15 秒更新一次信息。

请帮忙！

我应该添加所有应该显示的 php 数组都在 Small.php 中执行，并且我将它包含到的页面就是这样隔离的。

编辑：没有人注意到我的第一个引用 jQuery 的脚本没有结束标记，这破坏了我的第二个脚本。添加适当的结束标记后，脚本终于可以工作了，但是如果不先使用淡出，淡入就无法正确显示。

4

5 回答 5

10

您的代码有效，但fadeIn无效，因为它已经可见。我认为你想要达到的效果是：fadeOut→ load→ fadeIn：

var auto_refresh = setInterval(function () {
    $('.View').fadeOut('slow', function() {
        $(this).load('/echo/json/', function() {
            $(this).fadeIn('slow');
        });
    });
}, 15000); // refresh every 15000 milliseconds

在这里试试：http: //jsfiddle.net/kelunik/3qfNn/1/

附加通知：正如 Khanh TO 提到的，您可能需要摆脱浏览器的内部缓存。他提到，你可以使用$.ajaxand或 random-hack 来做到这一点。$.ajaxSetup ({ cache: false });

于 2013-09-14T08:00:47.307 回答
7

尝试这个

<script type="text/javascript">
window.onload = function(){


var auto_refresh = setInterval(
function ()
{
$('.View').html('');
$('.View').load('Small.php').fadeIn("slow");
}, 15000); // refresh every 15000 milliseconds

}
</script>
于 2013-09-14T07:56:16.387 回答
1

您的 html 不是每 15 秒更新一次。原因可能是浏览器缓存。添加Math.random()以避免浏览器缓存，最好等到 DOM 完全加载，正如@shadow 指出的那样。但我认为主要原因是缓存

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js" />
<script type="text/javascript">
$(document).ready(function(){
    var auto_refresh = setInterval(
    function ()
    {
       $('.View').load('Small.php?' + Math.random()).fadeIn("slow");
    }, 15000); // refresh every 15000 milliseconds
});
</script>
于 2013-09-14T07:56:55.283 回答
0 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js" />

<div class="View"><?php include 'Small.php'; ?></div>

<script type="text/javascript">
$(document).ready(function() {
$('.View').load('Small.php');
var auto_refresh = setInterval(
    function ()
    {
        $('.View').load('Small.php').fadeIn("slow");
    }, 15000); // refresh every 15000 milliseconds
        $.ajaxSetup({ cache: true });
    });
</script>
于 2013-09-14T10:41:00.887 回答
0

您正在使用的代码也将包含淡出效果。这是你想要达到的目标吗？如果没有，那么在“Small.php”中添加以下内容可能更有意义。

<meta http-equiv="refresh" content="15" >

这将每 15 秒刷新一次 small.php 页面，这意味着如果 PHP 将其调用到另一个页面，则只有该“框架”会重新加载。

让我们知道它是否有效/解决了您的问题！？

-布拉德

于 2013-09-14T08:16:36.103 回答