Question

我在页面上有两个模态。我只希望一旦关闭就刷新父页面。但是，即使我添加代码这样做，两个模态都会在关闭后刷新页面。知道为什么吗？

<script>
    $(document.body).on('hidden.bs.modal', function () {
    $('#myModal').removeData('bs.modal');
    });
</script>

<script>
    $(document.body).on('hidden.bs.modal', function () {
    $('#myModal2').removeData('bs.modal');
    location.reload();
    });
</script>

模态1电话：

<a data-toggle="modal" data-target="#myModal" href="modal_target.cfm?M=#MLink#" class="btn btn-#bg_color#">#CP#</a>

模态2电话：

<a data-toggle="modal" data-target="#myModal2" href="modal_AmendCP.cfm?M=#MLink#" title="view details" class="btn btn-primary">#Measure#</a>

感谢您的帮助！

Answer 1

在@teams = Team.all.order(points: :desc)上的模态关闭事件中，您的两个函数都被触发。

您应该将其更改为仅在模态对象上触发：

$(document.body)

From the Bootstrap Documentation:

hidden.bs.modal ：当模态完成对用户的隐藏时将触发此事件（将等待CSS转换完成）。

Answer 2

你应该选择精确的模态来添加事件监听器。如果选择器是＆＃34; document.body＆＃34;，则事件将同时触发。在你的代码中：函数调用＆＃39; hidden.bs.modal＆＃39;只是

function () {
$('#myModal2').removeData('bs.modal');
location.reload();
}

它取代

function () {
$('#myModal').removeData('bs.modal');
}

因为它稍后宣布。

关闭特定模态后重新加载页面

2 个答案: