如何重新启动模式，当它被关闭并重新打开它？
如何重新启动模式，当它被关闭并重新打开它？
提问于 2014-11-11 10:45:45
我在引导模式中有一个列表框和一个按钮。当单击按钮时，一个新的按钮在模态的div中呈现。当我关闭该模型并重新打开它时，在该模型上执行的最后一次操作(如前面呈现的按钮)仍然存在于该模态中。
如何重置模式，以便当模式再次打开时，按钮不存在，用户可以再次从列表框中选择该选项，然后单击该按钮来呈现一个新按钮等等。
<!-- Modal -->
<div
class="modal fade"
id="myModal"
tabindex="-1"
role="dialog"
aria-labelledby="myModalLabel"
aria-hidden="true"
>
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">
<span aria-hidden="true">×</span
><span class="sr-only">Close</span>
</button>
<h4 class="modal-title" id="myModalLabel">Select Language</h4>
</div>
<div class="modal-body">
<button type="button" class="btn" data-dismiss="modal">Close</button>
<button type="button" class="btn" id="submit_form">Submit</button>
<div class="modal-body1">
<div id="placeholder-div1"></div>
</div>
</div>
<div class="modal-footer">
<script>
$("#submit_form").on("click", function () {
$(".modal-body1").html("<h3>test</h3>");
});
</script>
<script>
$(function () {
$(".modal-footer").click(function () {
$(".modal").modal("hide");
});
});
</script>
</div>
</div>
</div>
</div>-更新
为什么这个不行？
<script type="text/javascript">
$(function () {
$("#myModal").on("hidden.bs.modal", function (e) {
console.log("Modal hidden");
$("#placeholder-div1").html("");
});
});
</script>回答 18
Stack Overflow用户
回答已采纳
发布于 2014-11-11 11:41:04
当模式隐藏时，只需手动重置任何内容：
$(".modal").on("hidden.bs.modal", function(){
$(".modal-body1").html("");
});还有更多的事件。更多关于他们的这里
$(document).ready(function() {
$(".modal").on("hidden.bs.modal", function() {
$(".modal-body1").html("Where did he go?!?!?!");
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
Launch modal
</button>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span>
</button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
<div class='modal-body1'>
<h3>Close and open, I will be gone!</h3>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
Stack Overflow用户
发布于 2018-08-21 11:22:46
试过了，工作得很好
$('#MyModal').on('hidden.bs.modal', function () {
$(this).find('form').trigger('reset');
})reset是dom内建函数，也可以使用$(this).find('form')[0].reset();。
Bootstrap的modal类公开了一些连接到模态功能( detail 在这里 )的事件。
当
hide.bs.modal实例方法被调用时，立即触发此事件。hidden.bs.modal此事件是在模式对用户隐藏完毕后触发的(将等待CSS转换完成)。
Stack Overflow用户
发布于 2015-05-28 10:54:10
对我有帮助的是，在就绪函数中插入以下一行：
$(document).ready(function()
{
..
...
// codes works on all bootstrap modal windows in application
$('.modal').on('hidden.bs.modal', function(e)
{
$(this).removeData();
}) ;
...
..
});当模式窗口关闭并再次打开时，先前输入的和选定的值将被重置为初始值。
我希望这也能帮到你！
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/26863003
复制相关文章
相似问题
腾讯云开发者
