要实现不刷新页面显示管理员通知,可以使用Ajax技术。下面是一个示例代码,使用jQuery的Ajax方法来实现:
HTML代码:
JavaScript代码(使用jQuery):
$(document).ready(function() {
// 页面加载完成时,先获取一次通知
getNotification();
// 点击按钮时,获取通知
$("#refreshBtn").click(function() {
getNotification();
});
});
function getNotification() {
$.ajax({
url: "get_notification.php", // 替换为获取通知的后端接口URL
type: "GET",
dataType: "json",
success: function(response) {
// 获取通知成功后,更新页面上的通知内容
$("#notification").html(response.notification);
},
error: function(xhr, status, error) {
console.log("获取通知失败: " + error);
}
});
}
上述代码使用了一个名为get_notification.php
的后端接口来获取管理员通知的内容。在后端接口中,可以从数据库或其他数据源获取通知内容,并将其以JSON格式返回。在前端的Ajax请求成功后,将通知内容更新到页面上的#notification
元素中。
注意,上述示例中使用了jQuery库和jQuery的Ajax方法。如果项目中没有使用jQuery,可以使用原生JavaScript的XMLHttpRequest
对象来实现相同的功能。