loading圖標modal彈窗 和jquery ajax的關係

在ajax配置中 ，async:false,非異步，modal窗口會失效，只有從新設置爲async:true,或者刪除async的設置，則loading的模態框才能展現出來

loading圖標的模態框；

<div class="modal" id="loading" tabindex="-1" role="dialog" aria-labelledby="imgModalLabel" aria-hidden="true" data-backdrop="static" data-keyboard="false" style="z-index: 9990; display: none;">

        <!-- URL -->
        <div class="modal-dialog">
            <div class="loading">
                <!--conter-->
                <img src=<?=Url::to('basic/web/imgs/loading2.gif',true)?>>
            </div>
        </div>
        <!--URLend-->
    </div>

 

JS代碼

//添加訂單觸發事件
additem = function(id){

    $('#loading').modal('show');
// return;
    if(id==null||id==undefined||id==''){

        alert('id沒有或者無效');
        return;
    }
    var url ='/basic/web/index.php?r=site/orders';

    $.ajax({
        //async:false,非異步，modal窗口失效；
        async:true,
        url:url,
        type:'POST',
        data:{
            buyer_id:$('#buyer').val(),
            item_id:id,
            qty:1,
            price_sale:$('#price'+id).val(),
        },
        dataType:'html',
        
    })
    .done(function(msg){
        $('#loading').modal('hide');
        alert(msg);
    });
}