我正在使用 Bootstrap 模式向访问网站的用户显示一些信息,因此我需要它在该用户访问该网站时立即显示。在单击按钮后显示的另一个页面中使用了类似的模态,我没有遇到任何问题,但是现在,由于我在页面加载时显示模态,所以我无法在按下按钮后隐藏它。任何帮助将不胜感激。另外,我认为这并不重要,但我正在使用 Yii。
代码如下:
<div id='modalConfirm' class="modal" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<h4 class="modal-title" align="center">Reservation Confirmation</h4>
</div>
<div class="modal-body" align="center">
<p>This is your confirmation</p>
</div>
<div class="modal-footer">
<button id="accButton" type="button" class="btn btn-info" data-target="#modalConfirm" data-dismiss="modal">Accept</button>
</div>
</div>
</div>
$(function(){
$('#accButton').click(function(){
$('#modalConfirm').modal('hide');
});
});
最佳答案
由于您将其显示为 HTML 的一部分,您可能希望仅使用 plain-ol-jQuery 来隐藏它。
$("#modalConfirm").hide();
或者,您可以尝试使用 Javascript 在页面加载时隐藏它:
$(document).ready(function() {
$("#modalConfirm").modal("show");
});
使用此解决方案,您可以按照最初的预期使用模态,并且在调用模态隐藏方法时可能会获得更好的结果。
无论哪种方式,请仔细检查您的 bootstrap Javascript 文件是否已正确包含以及模态函数是否确实存在。
关于javascript - Bootstrap 模式没有正确隐藏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33429227/