我有一个使用 PHP、MySQL 和 jQuery 开发的新闻源。新闻提要通过每 5 秒获取新内容来完成其工作。然而，这是通过“刷新”完整内容来完成的。我只想将任何新内容添加到新闻源中。我希望使用淡入或滚动效果(jQuery)来实现此目的。已加载的项目应保留在提要中，而不是使用任何新内容重新加载。我怎样才能做到这一点？
这是我的 2 个页面和代码。
feed.php
<body >
<script>
window.setInterval(function(){
refreshNews();
}, 5000);
</script>
<div id="news"></div>
<script>
function refreshNews()
{
$("#news").fadeOut().load("ajax.php", function( response, status, xhr){
if (status == "error"){
}
else
{
$(this).fadeIn();
}
});
}
</script>
</body>
</html>
ajax.php
<?php require_once('../../Connections/f12_database_connect.php'); ?>
<?php
if (!function_exists("GetSQLValueString")) {
function GetSQLValueString($theValue, $theType, $theDefinedValue = "", $theNotDefinedValue = "")
{
if (PHP_VERSION < 6) {
$theValue = get_magic_quotes_gpc() ? stripslashes($theValue) : $theValue;
}
$theValue = function_exists("mysql_real_escape_string") ? mysql_real_escape_string($theValue) : mysql_escape_string($theValue);
switch ($theType) {
case "text":
$theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
break;
case "long":
case "int":
$theValue = ($theValue != "") ? intval($theValue) : "NULL";
break;
case "double":
$theValue = ($theValue != "") ? doubleval($theValue) : "NULL";
break;
case "date":
$theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
break;
case "defined":
$theValue = ($theValue != "") ? $theDefinedValue : $theNotDefinedValue;
break;
}
return $theValue;
}
}
mysql_select_db($database_f12_database_connect, $f12_database_connect);
$query_newsfeed_q = "SELECT * FROM newsfeed ORDER BY pk DESC";
$newsfeed_q = mysql_query($query_newsfeed_q, $f12_database_connect) or die(mysql_error());
$row_newsfeed_q = mysql_fetch_assoc($newsfeed_q);
$totalRows_newsfeed_q = mysql_num_rows($newsfeed_q);
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
</head>
<body>
<table border="1">
<tr>
<td>pk</td>
<td>title</td>
<td>content</td>
</tr>
<?php do { ?>
<tr>
<td><?php echo $row_newsfeed_q['pk']; ?></td>
<td><?php echo $row_newsfeed_q['title']; ?></td>
<td><?php echo $row_newsfeed_q['content']; ?></td>
</tr>
<?php } while ($row_newsfeed_q = mysql_fetch_assoc($newsfeed_q)); ?>
</table>
</body>
</html>
<?php
mysql_free_result($newsfeed_q);
?>
最佳答案
我不太确定你是如何进行此设置的，但它似乎不正确:
- 创建一个仅包含 php 代码的文件，该文件将返回一个包含最新新闻的 json 对象；您将在客户端解析该对象。以下是此 php 文件的响应示例。
newsFeed.php
<php
$array_with_news = array('news1' => array('pk' => 'pk1', 'title' => 'title1', 'content' => 'title2'), 'news2' => array('pk' => 'pk2', 'title' => 'title2', 'content' => 'content2'));
echo json_encode($array_with_news);
?>
- 第二个文件将包含 feed.php 和 ajax.php 的其余部分。当您执行 ajax 调用更新的新闻时，新创建的 php 文件将使用 json 对象进行响应，您将解析该对象并使用其最新内容设置表的值。
index.php
<html>
<head>
<script type="text\javascript">
window.setInterval(function(){
updateNews();
}, 5000);
function updateNews(){
var scope = this;
$.getJSON('newsFeed.php*', function(data) {
//data will contain the news information
$.each(data, function(index, value) {
this.addNewsRow(value);
});
});
}
function addNewsRow(newsData){
//this function will add html content
var pk = newsData.pk, title = newsData.title, content = newsData.content;
$('#news').append(pk + ' ' + title + ' ' + content);
}
</script>
</head>
<body>
<div id="news"></div>
</body>
</html>
我还没有对此进行测试，但这是它应该如何工作的总体思路。 index.php 是用户要去的地方，每个时间间隔我们都会执行 updateNews，这个函数负责通过 AJAX 调用 newsFeed.php。 newsFeed.php 负责查询数据库并返回一个包含所有新闻信息的 json 对象。一旦 updateNews() 从 newsFeed.php 获取响应，它将循环遍历 JSON 对象并将响应的内容添加到 div。
希望这是有道理的。
关于php - 将 jQuery 淡入或滚动效果应用于 Facebook Like Newsfeed，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8195546/