javascript - 所示方法上的引导模式多次运行

Question

我使用twitter bootstrap modals的 js 来显示和隐藏一个模态：

$('#myModal').modal('show')//show
$('#myModal').on('shown', function () {
// do something…
})
$('#myModal').on('hidden', function () {
// do something…
})

....
$('#myModal').modal('hide')//hide

我的问题是当多次显示和隐藏模式时，代码//do something...运行多次。我想那是因为每次我显示一个模态时，它会shown在模态隐藏和打开 5 次时侦听并且函数运行 5 次，有什么方法可以防止这种情况发生吗？

---

使用fco下面建议的方式确实解决了显示的问题，但不幸的是隐藏不起作用，即仍然执行多次，不同的是，我使用data-dismiss="modal"标记隐藏对话框，而不是通过 js。

有任何想法吗？

Answer 1

您应该使用 one 而不是 on

.one() 方法与 .on() 方法相同，只是处理程序在第一次调用后是未绑定的。例如：

$('#myModal').modal('show')//show
$('#myModal').one('shown', function () {
// do something…
})
$('#myModal').one('hidden', function () {
// do something…
})

....
$('#myModal').modal('hide')//hide

Answer 2

签出.off()

如果您希望事件处理程序仅在第一次运行时运行，您需要执行以下操作：

function myHandler() {
    //your event handling code here
    $('#myModal').off('show', myHandler);
}
$('#myModal').on('shown', myHandler);
$('#myModal').modal('show');
//...
$('#myModal').modal('hide');