AJAX PHP微博更新源
我被困在我的大学项目上，我一直在写一个小时间的微博，这可能看起来很愚蠢，但我不知道如何在不破坏每月带宽的情况下自动刷新提要，这是我使用atm的代码 Data.phpAJAX PHP微博更新源,php,javascript,ajax,web,self-updating,Php,Javascript,Ajax,Web,Self Updating,我被困在我的大学项目上，我一直在写一个小时间的微博，这可能看起来很愚蠢，但我不知道如何在不破坏每月带宽的情况下自动刷新提要，这是我使用atm的代码 Data.php <?php // connect to the database require_once 'script/login.php'; //show results $query = "SELECT post, PID, fbpic, fbname, fblink, post_date, DATE_FORMAT(post_da
<?php
// connect to the database
require_once 'script/login.php';
//show results
$query = "SELECT post, PID, fbpic, fbname, fblink, post_date, DATE_FORMAT(post_date, 'Posted on %D %M %Y at %H:%i') AS pd FROM `posts` WHERE 1\n"
. "ORDER BY `post_date` DESC LIMIT 0, 30 ";
$result = @mysql_query ($query);
if ($result) { //If it ran ok display the records
echo '<div id="feed">';
while ($row = mysql_fetch_array ($result, MYSQL_ASSOC)) {
echo '<a name="' . $row['PID'] . '"></a><div id="postsint"><a target="_blank" href="http://www.facebook.com/' . $row['fblink'] . '"><img id="dp" title="' . $row['fbname'] . '" src="https://graph.facebook.com/' . $row['fbpic'] . '/picture"/></a><div id="posttext">' . base64_decode($row['post']) . '<blockquote>' . $row['pd'] . '</blockquote><a href="https://www.facebook.com/dialog/feed?app_id=505747259483458&link=http://www.wisp-r.com/share.php?id=' . $row['PID'] . '&picture=http://www.wisp-r.com/images/app-icon.png&name=Wispr by ' . $row['fbname'] . '&caption=' . $row['pd'] . '&description=' . htmlspecialchars(base64_decode($row['post']), ENT_QUOTES) . '&redirect_uri=http://www.wisp-r.com/share.php?id=' . $row['PID'] . '">Share</a></div></div><br />';
};
echo '</div>';
mysql_free_result ($result);
} else { //if it did not run ok
echo '<h2 id="error">Wisprs could not be retrieved. We apologise for any inconvienience.</h2>'; //public message
echo '<p id="error">' . mysql_error() . '<br /><br /> Query: ' . $query . '</p>'; //debugging message
}
mysql_close(); // Close database connection
?>
希望您可以使用jQuery
添加到content.php：
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript">
function getFeed(){
$.post('Data.php',function(data){
$("#postlist").html(data);
});
setTimeout("getFeed();",2000);
}
window.onload = getFeed();
</script>
函数getFeed（）{
$.post（'Data.php'，函数（数据）{
$（“#postlist”）.html（数据）；
});
setTimeout（“getFeed（）；”，2000）；
}
window.onload=getFeed（）；
在页面加载时调用getFeed（），然后每2000毫秒调用一次自身，并将从data.php接收的数据附加到postlist元素中
这是蛮力的强迫，使它不断删除postlist div中的旧html，并每2秒创建所有新html。如果要加载图像，则需要更复杂的解决方案。如果使用KnockoutJS和jQuery，这可能是一个很好的起点：
content.php
<script type="text/javascript">
$(function() {
// Define our view model that we will feed to KnockoutJS.
var viewModel = {
posts: []
};
// We'll use this variable to keep track of the last post we
// received. When we send our GET request, our php script will be
// able to see $_GET['last_post_date'] and only return the posts
// that come after that.
var last_post_date = null;
// This is the function that will get called every 2 seconds to
// load new data.
var getData = function() {
$.ajax({
url: "/data.php",
data: {
last_post_date: last_post_date
}
}).done( function( data ) {
// We'll assume data.php will give us a JSON object that looks
// like: { posts: [] }
// Append the new posts to the end of our 'posts' array in our
// view model.
viewModel.posts.concat( data.posts );
// Tell KnockoutJS to update the html.
ko.applyBindings( viewModel );
// Store the date of the last post to use in our next ajax call.
last_post_date = viewModel.posts[ viewModel.posts.length - 1 ].post_date;
});
// In 2 seconds, call this function again.
setTimeout( getData, 2000 );
};
// grab the first set of posts and start looping
getData();
});
</script>
<!-- We're telling KnockoutJS that for each 'row' in our 'posts' array, apply
the template named 'row-template'. -->
<div id="postlist"
data-bind="template: { name: 'row-template', foreach: posts }"></div>
<!-- This is the KnockoutJS template that we referenced earlier. Of course,
you don't have to use KnockoutJS to do this. There are plenty of other ways
to do this. Do keep in mind that you'll minimize your bandwidth usage if you
send JSON and use an HTML template rather than loading the same HTML over
and over again. -->
<script type="text/html" id="row-template">
<a data-bind="attr: {name: PID}"></a>
<div id="postsint">
<a target="_blank" data-bind="
attr: {
href: 'http://www.facebook.com/' + fblink
}
">
<img id="dp" data-bind="
attr: {
title: fbname,
src: 'https://graph.facebook.com/' + fbpic + '/picture'
}
" />
</a>
<div id="posttext">
<!--ko text: post--><!--/ko-->
<blockquote data-bind="text: pd"></blockquote>
<a data-bind="
attr: {
href: 'https://www.facebook.com/dialog/feed?' +
'app_id=505747259483458&' +
'link=http://www.wisp-r.com/share.php?' +
'id=' + PID + '&' +
'picture=http://www.wisp-r.com/images/app-icon.png&' +
'name=Wispr by ' + fbname + '&' +
'caption=' + pd + '&' +
'description=' + post + '&' +
'redirect_uri=http://www.wisp-r.com/share.php?id=' + PID
}
">
Share
</a>
</div>
</div>
<br />
</script>
<?php
// ... do sql stuff ...
// Remember to add a WHERE statement to filter out posts that are earlier than
// or equal to $_GET['last_post_date'].
$posts = array();
if ( $result ) {
while ( $row = mysql_fetch_array( $result, MYSQL_ASSOC ) ) {
array_push( $posts, $row );
}
}
echo json_encode( array( 'posts' => $posts ) );
$（函数（）{
//定义我们将提供给KnockoutJS的视图模型。
var viewModel={
员额：[]
};
//我们将使用此变量跟踪上次发布的文章
//收到。当我们发送GET请求时，我们的php脚本将
//能够看到$GET['last_post_date']，并且只返回帖子
//那之后就来了。
var last_post_date=null；
//这是每2秒调用一次的函数，用于
//加载新数据。
var getData=function（）{
$.ajax({
url:“/data.php”，
数据：{
上次发布日期：上次发布日期
}
}).完成（功能（数据）{
//我们假设data.php将为我们提供一个JSON对象
//比如：{posts:[]}
//将新帖子附加到
//视图模型。
viewModel.posts.concat（data.posts）；
//告诉KnockoutJS更新html。
应用绑定（视图模型）；
//存储最后一篇文章的日期，以便在下一次ajax调用中使用。
上次发布日期=viewModel.posts[viewModel.posts.length-1]。发布日期；
});
//2秒钟后，再次调用此函数。
setTimeout（getData，2000）；
};
//抓住第一组帖子，开始循环
getData（）；
});
data.php
<script type="text/javascript">
$(function() {
// Define our view model that we will feed to KnockoutJS.
var viewModel = {
posts: []
};
// We'll use this variable to keep track of the last post we
// received. When we send our GET request, our php script will be
// able to see $_GET['last_post_date'] and only return the posts
// that come after that.
var last_post_date = null;
// This is the function that will get called every 2 seconds to
// load new data.
var getData = function() {
$.ajax({
url: "/data.php",
data: {
last_post_date: last_post_date
}
}).done( function( data ) {
// We'll assume data.php will give us a JSON object that looks
// like: { posts: [] }
// Append the new posts to the end of our 'posts' array in our
// view model.
viewModel.posts.concat( data.posts );
// Tell KnockoutJS to update the html.
ko.applyBindings( viewModel );
// Store the date of the last post to use in our next ajax call.
last_post_date = viewModel.posts[ viewModel.posts.length - 1 ].post_date;
});
// In 2 seconds, call this function again.
setTimeout( getData, 2000 );
};
// grab the first set of posts and start looping
getData();
});
</script>
<!-- We're telling KnockoutJS that for each 'row' in our 'posts' array, apply
the template named 'row-template'. -->
<div id="postlist"
data-bind="template: { name: 'row-template', foreach: posts }"></div>
<!-- This is the KnockoutJS template that we referenced earlier. Of course,
you don't have to use KnockoutJS to do this. There are plenty of other ways
to do this. Do keep in mind that you'll minimize your bandwidth usage if you
send JSON and use an HTML template rather than loading the same HTML over
and over again. -->
<script type="text/html" id="row-template">
<a data-bind="attr: {name: PID}"></a>
<div id="postsint">
<a target="_blank" data-bind="
attr: {
href: 'http://www.facebook.com/' + fblink
}
">
<img id="dp" data-bind="
attr: {
title: fbname,
src: 'https://graph.facebook.com/' + fbpic + '/picture'
}
" />
</a>
<div id="posttext">
<!--ko text: post--><!--/ko-->
<blockquote data-bind="text: pd"></blockquote>
<a data-bind="
attr: {
href: 'https://www.facebook.com/dialog/feed?' +
'app_id=505747259483458&' +
'link=http://www.wisp-r.com/share.php?' +
'id=' + PID + '&' +
'picture=http://www.wisp-r.com/images/app-icon.png&' +
'name=Wispr by ' + fbname + '&' +
'caption=' + pd + '&' +
'description=' + post + '&' +
'redirect_uri=http://www.wisp-r.com/share.php?id=' + PID
}
">
Share
</a>
</div>
</div>
<br />
</script>
<?php
// ... do sql stuff ...
// Remember to add a WHERE statement to filter out posts that are earlier than
// or equal to $_GET['last_post_date'].
$posts = array();
if ( $result ) {
while ( $row = mysql_fetch_array( $result, MYSQL_ASSOC ) ) {
array_push( $posts, $row );
}
}
echo json_encode( array( 'posts' => $posts ) );
您没有提供任何Javascript代码来向我们显示您是如何每2秒更新一次的。或者你还没有创建任何脚本，这就是你希望我们帮助你的？我们很想帮助你，但你的问题很模糊，JavaScript在哪里？我没有写任何脚本，我有一个脚本，但它破坏了我的每月带宽，所以我取下它，我真的在寻找我问题的答案，这是含糊不清的，因为我没有任何东西可以放进去=/处理过，这是我以前使用的代码，但是window.onload=getFeed（）
part会在页面加载时立即加载，因此我将刷新超时时间提高到20000（20秒）@DanielJamesMonaghan Nice site&祝您的其他项目好运谢谢各位，我已经完成了基本布局，只需要做一些基本整理（样式和移动网站破坏），尽管这看起来非常令人印象深刻，我不知道如何实现这一点，它从字面上飞过我的头哈哈，为答案欢呼，但这看起来太复杂的课程我做tbh。。。（我们的“网页设计”模块是定制wordpress安装…我在4小时内完成了该模块）=/