Hey guys, I'm using jquery to load posts from another page every 5 seconds by using this code:
<script>
jQuery(function($){
$('#loaddiv').show();
})
var auto_refresh = setInterval(
function(){
$('#loaddiv').hide().load('reload.php').show();
}, 5000);
</script>
And here's reload.php:
<?php
session_start();
ini_set('display_errors', 'On');
error_reporting(E_ALL);
$mysql=mysql_connect('localhost','***','***');
mysql_select_db('jmtdy');
$result=mysql_query("select * from users where username='".$_SESSION['username']."'") or die(mysql_error());
$dbarray=mysql_fetch_assoc($result);
$id=$dbarray['id'];
$result1=mysql_query("select * from friendship where userid='".$id."'") or die(mysql_error());
$dbarray1=mysql_fetch_assoc($result1);
$userid=$dbarray1['friendid'];
$result2=mysql_query("select * from posts where userid='".$userid."' or userid='".$id."' ORDER BY id DESC LIMIT 20") or die(mysql_error());
if(mysql_num_rows($result2) >=1) {
while($dbarray2=mysql_fetch_assoc($result2)) {
echo '<div class="homestatus"><a class="homeusername" href="account.php?user='.$dbarray2['username'].'">'
.$dbarray2['fname'].' '.$dbarray2['lname'].':<a><p class="homepost">'
.$dbarray2['post'].'</p><p class="hometime">'.$dbarray2['time'].'</p></div>';
}
}
else {
echo '<p class="homestatus">No new updates from your friends.</p>';
}
?>
It's working perfectly but my question is, how can I slide in the new results sort of how Quora slides in new answers in questions using jquery?
Ok I came up with this:
<script>
jQuery(function($){
$('#loaddiv').show();
})
var auto_refresh = setInterval(
function(){
var timestamp = new Date().getTime() - 5000;
// get posts for the last 5 seconds only
var new_posts = $.load('reload.php?time=' + timestamp);
$('#loaddiv').append(new_posts).show('slow');
}, 5000);
</script>
and this:
<?php
session_start();
ini_set('display_errors', 'On');
error_reporting(E_ALL);
$mysql=mysql_connect('localhost','***','***');
mysql_select_db('jmtdy');
$result=mysql_query("select * from users where username='".$_SESSION['username']."'") or die(mysql_error());
$dbarray=mysql_fetch_assoc($result);
$id=$dbarray['id'];
$result1=mysql_query("select * from friendship where userid='".$id."'") or die(mysql_error());
$dbarray1=mysql_fetch_assoc($result1);
$userid=$dbarray1['friendid'];
$time=mysql_real_escape_string($_GET['time']);
$result2=mysql_query("select * from posts where userid='".$userid."' or userid='".$id."' and time='".$time."' ORDER BY id DESC LIMIT 20") or die(mysql_error());
if(mysql_num_rows($result2) >=1) {
while($dbarray2=mysql_fetch_assoc($result2)) {
echo '<div class="homestatus"><a class="homeusername" href="account.php?us开发者_如何学运维er='.$dbarray2['username'].'">'.$dbarray2['fname'].' '.$dbarray2['lname'].':<a><p class="homepost">'.$dbarray2['post'].'</p><p class="hometime">'.$dbarray2['time'].'</p></div>';
}
}
else {
echo '<p class="homestatus">No new updates from your friends.</p>';
}
?>
But I get this error: Notice: Undefined index: time in /var/www/Cliproid/reload.php on line 13
I would maybe use a unique(auto_increment) id, or a timestamp stored somewhere in the script.
Then use that identifier when making your request, so you only fetch results > last id/timestamp. Then with that result, use $('#loaddiv').prepend(data).fadein() to insert that data to the beginning (top) of the list.
I do not know how Quora works, but use some of the effect in jQuery instead of plain show() function. Try 'animate' or something different http://api.jquery.com/category/effects/
<script>
jQuery(function($){
$('#loaddiv').show();
})
var auto_refresh = setInterval(
function(){
var timestamp = new Date().getTime() - 5000;
// get posts for the last 5 seconds only
var new_posts = $.get('reload.php?time=' + timestamp);
$('#loaddiv').append(new_posts).show('slow');
}, 5000);
</script>
精彩评论