首页 > 解决方案 > 当引导模式已经打开时,如何防止使用 jquery 刷新 div?

问题描述

我每 30 秒刷新一次 div,在我刷新的 div 内有一个引导模式框。如果该模态被单击并打开,那么当 div 刷新模态消失时,整个页面都无法单击。我正在努力寻找解决方案。

我希望在模式框打开时防止 div 刷新。有任何想法吗?谢谢

<div class="modal fade" id="alertModal" tabindex="-1" role="dialog" aria-labelledby="alertModalLabel" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header bg-info text-white">
        <h5 class="modal-title" id="alertModalLabel">Modal Title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
      </div>
      <div class="modal-body">
        some content
      </div>
    </div>
  </div>
</div>
$(document).ready(function() {
  setInterval(function() {
    $('#mainc').fadeOut('slow').load('index.php #mainc').fadeIn('slow');
  }, 30000);
});

标签: jqueryhtmlmodal-dialog

解决方案


这是此问题的有效解决方案:

function setLoad() {$('#mainc').fadeOut('slow').load('index.php #mainc').fadeIn('slow');}
setInterval(setLoad,'10000');
$(document).on('hidden.bs.modal','.modal',function(){setInterval(setLoad,'10000');});
$(document).on('shown.bs.modal','.modal',function(){for(var i=1;i<10000;i++){clearInterval(i);}});

由于 hidden.bs.modal 使用随机 id 运行 setInterval(),因此无法在不知道 id 的情况下使用 clearInterval()。还要确保将 js 代码放在“.modal” div 上方,这样效果更好。


推荐阅读