Home >Web Front-end >Bootstrap Tutorial >How to close event in bootstrap modal box

How to close event in bootstrap modal box

爱喝马黛茶的安东尼
爱喝马黛茶的安东尼Original
2019-07-13 15:16:3416905browse

How to close event in bootstrap modal box

The modal box avoids clicking on the background to close:

1. Add the attribute aria-hidden="true" data-backdrop="static"## when the div is initialized. #

<div class="modal fade" id="edit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden=&#39;true&#39; 
data-backdrop=&#39;static&#39;>

2. When you need to display the modal box during initialization

$(‘#myModal&#39;).modal({
backdrop: ‘static&#39;,
//点击背景空白处不被关闭;
keyboard: false
//触发键盘esc事件时不关闭。
});

Related recommendations: "

bootstrap Getting Started Tutorial"

Customize the modal box display and Close trigger event:

$(".classname").click(function () {
  $(&#39;#mymodel&#39;).modal(&#39;show&#39;);
   alert(&#39;模态框打开了&#39;);
 });
 
$(&#39;#mymodel&#39;).on(&#39;hide.bs.modal&#39;, function () {
  alert(&#39;模态框关闭了&#39;);
});

How to close event in bootstrap modal box

The above is the detailed content of How to close event in bootstrap modal box. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn