早安,我可以在JQuery / Ajax中结合使用load()
和append()
吗?
例如。
我可以结合使用load()
和prepend()
吗?例如。
$('#notify').load(' #notify',function(){
$('#notification').prepend(`
<li>notif1</li>
<li>notif2</li>
`);
})
已更新:
原始代码是这样的。
function notif(){
$.ajax({
url: `/iaccs-hook-notifications`,
method: 'GET',
success: function(data){
console.log(data);
// if (data.success){
// $("#notify").load(" #notify");
// }
if (data.length > 0) {
//proceed
$('#btn-notif').addClass('js-has-new-notification');
$('#notif-list').append(`
<li>
<div class="an-info-single unread">
<a href="{{url('iaccs-hook-list')}}">
<span class="icon-container important">
<i class="icon-setting"></i>
</span>
<div class="info-content">
<h5 class="user-name">Update Client</h5>
<p class="content"><i class="icon-clock"></i>${data[0].created_at}</p>
</div>
</a>
</div>
</li>
`);
}
},
error: function(err){
swal('Error!','Please report this issue.', 'error');
}
});
}
$(document).ready(function(e) {
// let refreshNotification = () => {
// $('#notify').load(location.href + ' #notify');
// $(this).unwrap()
// }
notif();
var socket = io('http://www.iaccs-admin-console.test' + ':8080');
socket.on("message", function(message){
notif()
// $('.unread').on('click',function(){
// $.get('/markAsRead');
// });
});
});
这是视图。
<div class="dropdown-menu" id="notify">
<p class="an-info-count">Notifications <span>{{count(auth()->user()->unreadNotifications)}}</span></p>
<div class="an-info-content notifications-info notifications-content">
<ul class="nav" id="notif-list">
</ul>
</div> <!-- end .AN-INFO-CONTENT -->
<div class="an-info-show-all-btn">
<a class="an-btn an-btn-transparent fluid rounded uppercase small-font" href="#">Show all</a>
</div>
</div>
上面的代码的问题是,您需要首先刷新页面,因为整个下拉菜单将通知用户并显示通知的数量。