我可以在JQuery / Ajax中组合load()和append()吗

时间:2018-12-27 03:24:40

标签: javascript jquery

早安,我可以在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>

上面的代码的问题是,您需要首先刷新页面,因为整个下拉菜单将通知用户并显示通知的数量。

0 个答案:

没有答案