我正在使用 bootstrap,我发现了一个非常好看的管理模板。此模板提供了在主导航中显示特定通知的可能性。如果我点击通知图标,会出现一个小弹出窗口,我可以在其中看到通知。
因此,我在左侧输入了绿色复选框,如果用户单击复选框,通知将标记为已读并从通知面板中消失。到目前为止,我的问题是我用 PHP 解决了这个解决方案,一旦我点击绿色复选框,整个页面就会重新加载。我现在正在寻找一个 jQuery 解决方案,以便在选中绿色复选框后页面不需要重新加载。因此,如果用户点击绿色复选框,通知应该会消失而无需重新加载页面。
我当前的代码是:
<?php
<ul class='dropdown-menu dropdown-navbar'>
<li>
<a href='./index.php?func=showsms&id=".$msg["id"][$x]."&sid=$sid' target='_blank' class='clearfix'>
<div class='col-sm-3'>
<span class='msg-time'>
<a class='btn btn-success btn-xs' href='./index.php?func=$func&read_sms=".$msg["id"][$x]."&sid=$sid' role='button'><i class='ace-icon fa fa-check bigger-110 icon-only'></i></a>
</span>
</span>\
</div>
<div class='col-sm-9'>
<a href='#messagebox_".$msg["id"][$x]."' role='button' class='green' data-toggle='modal'>
<span class='msg-body'>
<span class='msg-title'>
<span class='blue'>".$sender["firstname"][0]." ".$sender["lastname"][0].":</span>
$msg["smstitle"][$x]
</span>
<span class='msg-time'>
<i class='ace-icon fa fa-clock-o'></i>
<span>".date("d.m.Y H:i",$msg["time_created"][$x])."</span>
</span>
</a>
</div>
</li>
</ul>
?>
有人能告诉我我需要如何更改代码才能获得与 jQuery 效果相同的解决方案吗?我不擅长用 jQuery 编码。如果有人可以帮助我并告诉我我的代码应该是什么样子,那就太棒了。
谢谢, 克里斯
最佳答案
您写的是 HTML 而不是 PHP 代码!我相信应该有一个类可以将它更改为不同的颜色(阅读通知)。所以,你需要做的是:
$(".dropdown-menu dropdown-navbar li a").click(function () {
$(this).closest("li").addClass("read");
// The above code will make the presentation look read.
// Now make it really read:
$.post("notification.php", {id: the_post_id, action: read});
return false;
});
注意:我没有阻止点击链接的默认操作,因为当你点击链接时,它会触发读取操作,对吗?
我希望在 PHP 中,当您呈现 HTML 时,您会:
<li class="otherClass newClass type <?php if ($isRead) echo "read"; ?>">
关于javascript - jQuery - 将通知标记为已读,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32713356/