我正在为我的网站创建个人消息系统。为此,我想实时显示和更新每个聊天中的新消息数量,类似于以下屏幕截图中显示的红色“框”:
目前,消息计数未写入提供的 div 中,我不确定原因。
以下是相关的 HTML 代码:
<div class="chat_body">
<a href="index.php?section=pn&mode=loadConversation&ConversationID=<?php echo $conversation['id']; ?>">
<div class="user" id='<?php echo $i ?>' data-user-id='<?php echo $user_id?>' data-conv-id='<?php echo $conversation['id'] ?>'>
// Displaying the name, etc...
<?php
echo "<div class='rightCountUnreadMessages'>";
/* Showing the actual counter */
echo '<div class="badge" id="badge-'.$i.'"></div>';
echo "</div>";
?>
</div>
</a>
</div>
jQuery 函数,应确定每 500 毫秒新消息的数量:
jQuery(document).ready(function() {
//jQuery(setInterval(function() {
friends_count = document.getElementsByClassName("user").length;
for(var i=1; i < friends_count+1; i++) {
el = document.getElementById(i);
conv_id = el.getAttribute("data-conv-id");
user_id = el.getAttribute("data-user-id");
test = i;
jQuery.post('./Bauteile/Accounts/loadCounts/loadPNCount.php', {user_id_loadPN: user_id, conv_id: conv_id}, function(result){
console.log(result);
if(result > 99) result = "99+";
if(result > 0 || result == "99+") {
document.getElementById("badge-"+test).innerHTML = result;
}
})
}
//}, 500));
});
在 Javascript 中请求的文档具有以下内容:
<?php
$conv_id = $_POST['conv_id'];
$from_id = $_POST['user_id_loadPN'];
echo (int)mysql_result(mysql_query("SELECT COUNT(*) FROM `messages` WHERE `group_id` = $chat_id AND `from_id` = $from_id AND `read_on` is NULL"), 0);
?>
最佳答案
问题是你的循环中有一些异步的东西。为了解决这个问题,你需要一个闭包。您需要将 for 循环的内容包装在一个以 i 作为参数的函数中,然后在循环中调用该函数。
所以尝试这样的操作:
function doClosure(i) {
var el = document.getElementById(i),
conv_id = el.getAttribute("data-conv-id"),
user_id = el.getAttribute("data-user-id"),
test = i;
jQuery.post('./Bauteile/Accounts/loadCounts/loadPNCount.php', {user_id_loadPN: user_id, conv_id: conv_id}, function(result){
console.log(result);
console.log(test);
if(result > 99) {
result = "99+";
}
if(result > 0 || result == "99+") {
document.getElementById("badge-"+test).innerHTML = result;
}
});
}
for (var i = 1; i < document.getElementsByClassName("user").length+1; i++) {
doClosure(i);
}
关于javascript - 使用 jQuery 实现个人消息系统的实时消息计数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34929119/