我有一个像facebook这样的网站。它每 10 秒检查一次帖子以查看是否应加载任何新评论。代码看起来像这样：
<div id="profile_entry_1">
<div id="posttext_id1">Woot woot!</div>
<div id="comment_id15" class="checkForNewComments">This is the 15th comment in the database</comment>
<div id="more_wall_comments_div_1"></div>
</div>
<div id="profile_entry_2">
<div id="posttext_id2">Woot woot!</div>
<div id="comment_id16">This is the 16th comment in the database</comment>
<div id="comment_id17">This is the 17th comment in the database</comment>
<div id="comment_id18" class="checkForNewComments">This is the 18th comment in the database</comment>
<div id="more_wall_comments_div_2"></div>
</div>
所以上面有两个帖子，前两个在数据库中，每个都有评论。当页面第一次加载时，PHP 将查找最后一条评论并为其分配一个特定的类。
它被分配了一个“checkForNewComments”类，所以我的 JavaScript 可以获取它的 comment_id ID。
它将该 ID 发送到一个新页面，以查找对该帖子具有更大价值的评论，并将通过 jSon 格式的 Ajax 调用加载它们。我解析它，并将 .append() 它添加到“newComments”部分。
因此，如果代码找到新评论，它将删除帖子的“checkForNewComments”类
<div id="profile_entry_2">
<div id="posttext_id2">Woot woot!</div>
<div id="comment_id16">This is the 16th comment in the database</comment>
<div id="comment_id17">This is the 17th comment in the database</comment>
<div id="comment_id18">This is the 18th comment in the database</comment>
<div id="more_wall_comments_div_2"></div>
</div>
它加载的帖子，例如，comment_id19 现在将具有“checkForNewComments”类，因此在 10 秒内，当它查找新评论时，它将查找大于 19 的评论。
麻烦来了，JavaScript 无法访问新加载的 DIV 和 CLASS 信息。
我该怎么做？
这是我的 JavaScript
<script type="text/javascript">
var loadedComments = true;
function loadComRefresh(timeoutPeriod){ setTimeout("loadNewComs();",timeoutPeriod); }
function loadNewComs(){
if (loadedComments == true){
loadedComments = false;
var loadComString = "";
$('.loadNewComs').each(function() {
comLoad = this.id.substr(14);
testD = $("#more_wall_comments_div_" + comLoad).find(".commentDivID").attr("id");
if (testD != undefined){
addSub = ":"+ testD +"";
} else { addSub = ""; }
loadComString = loadComString + comLoad + addSub + ",";
});
$.ajax({
url: '../members/more_wall_comments_json.php',
data: "loadComString=" + loadComString,
dataType: "json",
cache: false,
success: function(data) {
loadedComments = true;
if (data != null){
for(var i=0; i<data.loadComs.length;i++) {
$("#postnewcomment" + data.loadComs[i].id).html(data.loadComs[i].script);
}
}
}
});
loadComRefresh(10000);
}
</script>
<body onLoad="loadComRefresh(10000);">
这是我的文档的 PHP/HTML
<?php
echo '
<div id="profile_entry_'. $recent_id .'" class="loadNewComs" '. $delete_mouse_over .'>
<table style="width:'. $table_width .'">
<tr>
<td style="width:50px;height:50px;padding:5px;vertical-align:top;">
<a href="'. $extralink .'viewmember.php?id='. $to_id .'"><img src="'. getMemberThumbnail($to_id) .'" style="width:50px;height:50px;display:block;" alt="" /></a>
</td>
<td style="padding:5px 5px 5px 0;vertical-align:top;width:100%;">
<a href="'. $extralink .'viewmember.php?id='. $to_id .'">'. getName($to_id) .'</a>
<div style="margin:2px 0 0 0;">'. getEmoticon(tagUserLinks(breakUp($change))) .'</div>'
<div id="more_wall_comments_div_'. $recent_id .'">';
$array = array();
$q = mysql_query("SELECT t1.id_id,t1.to_id,t1.from_id,t1.message_id,t1.like_id,t1.date_id,t1.mobile_id,t1.mobiletype_id,t2.user_id,t2.avatar FROM status_comments AS t1 LEFT JOIN users AS t2 ON t1.from_id = t2.id_id WHERE recent_id='$recent_id'") or die ('here!');
$q_count = mysql_num_rows($q);
while ($r = mysql_fetch_array($q)){
$that_count = $that_count + 1;
$comment_id = $r['id_id'];
$to_id = $r['to_id'];
$from_id2 = $r['from_id'];
$message_id = $r['message_id'];
$like = $r['like_id'];
$date = $r['date_id'];
$mobile = $r['mobile_id'];
$mobiletype = $r['mobiletype_id'];
$fromname_id = $r['user_id'];
$thumbnail = '../media/members/thumbs/'. $r['avatar'];
$array[$comment_id] = array($comment_id,$to_id,$from_id2,$message_id,$like,$date,$mobile,$mobiletype,$fromname_id,$thumbnail);
}
krsort($array);
$array = array_slice($array, 0, 3, true);
ksort($array);
if ($q_count > 0) {
foreach($array as $key => $value) {
$that_count = $that_count + 1;
$comment_id = $value[0];
$to_id = $value[1];
$from_id2 = $value[2];
$message_id = $value[3];
$like = $value[4];
$roughdate = $value[5];
$mobile = $value[6];
$mobiletype = $value[7];
$fromname_id = $value[8];
$thumbnail = $value[9];
if ($that_count == 1 AND $recentlikecount == 0 AND $recentdislikecount == 0 AND $comments_topped != 'true') {
echo '
<div id="'. $comment_id .'" class="commentDivID" style="width:'. $commentsize .';" '. $delete_mouse_over_comment .'>
<div style="width:'. $commentsize .';height:11px;background-image:url(../lib/images/comment_top.gif);"></div>
<table style="width:'. $commentsize .';background-color:#'. $_SESSION['BGCOLOR'] .';border-bottom:1px solid #ccd4d8;">
<tr>
<td style="width:35px;height:35px;padding:5px;vertical-align:top;">
<a href="'. $extralink .'viewmember.php?id='. $from_id2 .'"><img src="'. $thumbnail .'" style="width:35px;height:35px;display:block;" /></a>
</td>
<td style="padding:5px 5px 5px 0;vertical-align:top;">
<a href="'. $extralink .'viewmember.php?id='. $from_id2 .'">'. $fromname_id .'</a> '. getEmoticon(tagUserLinks(breakUp($message_id))) .'<br />
'. $mobile .' <span id="time'. $comment_id .'" name="'. $roughdate .'" class="loadTime">'. roughDate($roughdate) .'</span></span> '. $like_link .'
</td>
</tr>
</table>
</div>';
}
}
echo ' </div>';
现在我没有把代码放在这里，但是最后一条评论被分配了 class="commentDivID" ，而不是每条评论。
当 javascript 调用并找到要加载的新评论时，它将剥离 class="commentDivID" 的最后一条评论并将其放在加载的新评论中，但 javascript 无法访问新加载的项目，因此它不再能够找到 class="commentDivID"