标签:form表单 orm button targe dex mod btn boot footer
1.触发模态框弹窗的代码
这里复制了一段Bootstrap模态框的代码
<h2>创建模态框(Modal)</h2> <!-- 按钮触发模态框 --> <button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">开始演示模态框</button> <!-- 模态框(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" aria-hidden="true">×</button> <h4 class="modal-title" id="myModalLabel">模态框(Modal)标题</h4> </div> <div class="modal-body">在这里添加一些文本</div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button> <button type="button" class="btn btn-primary">提交更改</button> </div> </div><!-- /.modal-content --> </div><!-- /.modal --> </div>
其中,触发模态框的按钮是下面这句代码
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">开始演示模态框</button>
data-toggle="modal"是触发模态框的具体代码,去掉之后点击该按钮模态框不会弹出,也可以在里面用ajax写点击事件。
2.提交表单的功能
<form action="chuli.php" method="post">
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">开始演示模态框</button>
</form>
当点击“开始演示模态框”按钮时,会提交form表单,某些时候不需要这个按钮有提交表单的功能,就在里面加上type="button".
<form action="chuli.php" method="post"> <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">开始演示模态框</button> </form>
标签:form表单 orm button targe dex mod btn boot footer
原文地址:http://www.cnblogs.com/Strive-count/p/6227792.html