浅析BootStrap模态框的使用(经典)
作者:CQ_LQJ 时间:2023-08-20 02:21:19
BootStrap模态框简单概述
Bootstrap Modals(模态框)是使用定制的 Jquery 插件创建的。它可以用来创建模态窗口丰富用户体验,或者为用户添加实用功能。您可以在 Modals(模态框)中使用 Popover(弹出框)和 Tooltip(工具提示插件)。
1,Bootstrap 模态对话框和简单使用
div id="myModal" class="modal hide fade">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">x</button>
<h3>对话框标题</h3>
</div>
<div class="modal-body">
<p>对话框主体</p>
</div>
<div class="modal-footer">
<a href="#" class="btn" data-dismiss="modal">取消</a>
<a href="#" class="btn btn-primary" data-dismiss="modal">确定</a>
</div>
</div>
可以使用按钮或链接直接调用模态对话框,这是简单的用法:
<a href="#modal1" role="button" class="btn btn-primary btn-sm" data-toggle="modal">合同添加</a>
另外,当你需要让对话框能够在每次打开时表单数据清空,如下:
$('#modal1').modal('hide');
$("#modal1").on("hidden", function() {$('#form1')[0].reset();}); //添加合同后,清空表单操作
以上内容是小编给大家介绍的BootStrap模态框的使用,希望对大家有所帮助
标签:bootstrap,模态框,使用
0
投稿
猜你喜欢
python 实时遍历日志文件
2021-03-30 09:26:20
Python MD5加密实例详解
2021-10-24 20:31:26
SQL Server查询条件IN中能否使用变量的示例详解
2024-01-15 17:55:55
js date 格式化
2024-04-30 10:10:36
Python实现光速定位并提取两个文件的不同之处
2023-11-01 10:42:25
Python通过RabbitMQ服务器实现交换机功能的实例教程
2023-08-24 01:15:19
python匿名函数lambda原理及实例解析
2023-01-05 02:55:07
python 保存float类型的小数的位数方法
2021-06-28 05:44:12
MYSQL配置参数优化详解
2024-01-21 08:17:44
前端面试之vue2和vue3的区别有哪些
2024-04-28 10:54:38
python代码实现将列表中重复元素之间的内容全部滤除
2023-11-17 18:17:32
python的socket编程入门
2022-11-01 07:33:12
pycharm: 恢复(reset) 误删文件的方法
2023-09-09 10:11:24
Pandas之groupby( )用法笔记小结
2023-03-03 15:58:24
Python socket.error: [Errno 98] Address already in use的原因和解决方法
2021-07-12 01:27:02
Python中shutil模块的学习笔记教程
2022-12-22 20:42:05
python的time模块和datetime模块实例解析
2023-11-13 09:54:56
Navicat连接MySQL错误描述分析
2024-01-17 13:39:31
python pexpect ssh 远程登录服务器的方法
2021-07-10 22:28:53
MySQL死锁的产生原因以及解决方案
2024-01-26 16:11:40