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); }); }