每次打开模态时，模态中的 JavaScript 都会重复

Question

我有一个引导模式，里面有表单和 JavaScript。

我的模态内容(由ajax调用):

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="action">Submit</button>

<script>
    $('.action').on('click', function(){
        alert('ok');
    });
</script>

每次我单击按钮时，都会显示很多警报(不仅仅是一个)，当我一次又一次打开和关闭模式时，模式内的 JavaScript 不会重置/终止。

Answer 1

看来您设置了 <script>使用 AJAX 请求在模式内标记。所以每次调用 AJAX 请求时都会发出一个新的 <script>标签被执行并且一个新事件被绑定(bind)到按钮。这就是为什么您会显示多个警报。

要解决这个问题，只需将 JS 与模态隔离，或者只设置一次，而不是从 AJAX 调用中设置它。只需将其设为静态 <script>标签。

否则，在绑定(bind)新的单击事件之前销毁现有的事件处理程序。因为即使删除<script>，事件仍然绑定(bind)到元素。标签。