使用Jquery动态加载新内容

Dynamically load new content using Jquery

本文关键字:新内容 加载 动态 Jquery 使用      更新时间:2023-09-26

我有一个php文件,当这个页面加载时,我从include页面加载后的另一个页面获得数据,我有一个jquery代码,每50秒从另一个php代码加载新内容。这里是我的第一个PHP页面代码

<div id="load" class="scroll-cont">
<?php include 'time_line.php'; ?>
 </div>

ok我的jquery代码

var autoLoad = setInterval(
function ()
{
  $('#load_post').load('last.php').fadeIn("slow");
}, 40000);

这个jquery代码完美地从last.php<div id="load" class="scroll-cont">加载的数据,但擦除<?php include 'time_line.php'; ?>加载之前的所有数据。每隔50秒再次擦除jquery之前加载的所有数据。如何可能保持旧的加载数据和添加新的内容到div??你可以在Twitter时间轴上看到这个例子,当新数据加载到旧数据上时

似乎load不支持这个。但是您可以通过使用$.get:

实现相同的目的。
var autoLoad = setInterval(
function ()
{
  $.get('last.php', {}, function (res) {
    $('#load_post').append(res).fadeIn("slow");
  })
}, 40000);

您可以使用$.get()来代替.load(),以便使用HTTP GET请求从服务器加载last.php内部的数据,以及.append()在成功回调中插入返回内容到元素的末尾:

var autoLoad = setInterval(
function ()
{
    $.get('last.php', function (res) {
        $('#load_post').append(res).fadeIn('slow');
    })
}, 40000);

你可以这样做…

 var autoLoad = setInterval(
    function ()
    {
      $.get('last.php', {}, function (res) {
        $('#load_post').append(res);
      })
    }, 40000);

也可以通过ajax:

$.ajax({
        type: "GET",
        url: "your url",
        mimeType: "text/html; charset=iso-8859-2",
        data: {
            text: 4,
        },
        complete: function() {
        },
        success: function(msg) {
            $('#load_post').html(msg); 
        },
        error: function() {
            alert("Error in connection :(");
        }
    });