Bootstrap --对话框及提示框的处理和优化
源模态框使用:http://www.runoob.com/bootstrap/bootstrap-modal-plugin.html
<!-- 按钮触发模态框 -->
<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>
也可参考:http://www.cnblogs.com/wuhuacong/p/4775282.html
<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 bg-primary">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
<h4 class="modal-title">
<i class="icon-pencil"></i>
<span id="lblAddTitle" style="font-weight:bold">添加信息</span>
</h4>
</div>
<form class="form-horizontal form-bordered form-row-strippe" id="ffAdd" action="" data-toggle="validator" enctype="multipart/form-data">
<div class="modal-body">
<div class="row">
<div class="col-md-12">
<div class="form-group">
<label class="control-label col-md-2">父ID</label>
<div class="col-md-10">
<select id="PID" name="PID" type="text" class="form-control select2" placeholder="父ID..." ></select>
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label class="control-label col-md-2">名称</label>
<div class="col-md-10">
<input id="Name" name="Name" type="text" class="form-control" placeholder="名称..." />
</div>
</div>
</div>
<div class="col-md-12">
<div class="form-group">
<label class="control-label col-md-2">备注</label>
<div class="col-md-10">
<textarea id="Note" name="Note" class="form-control" placeholder="备注..."></textarea>
</div>
</div>
</div> </div>
</div>
<div class="modal-footer bg-info">
<input type="hidden" id="ID" name="ID" />
<button type="submit" class="btn blue">确定</button>
<button type="button" class="btn green" data-dismiss="modal">取消</button>
</div>
</form>
</div>
</div>
</div>
Bootstrap --对话框及提示框的处理和优化的更多相关文章
- 基于Metronic的Bootstrap开发框架经验总结(6)--对话框及提示框的处理和优化
在各种Web开发过程中,对话框和提示框的处理是很常见的一种界面处理技术,用得好,可以给用户很好的页面体验,Bootstrap开发也一样,我们往往在页面新增.编辑.查看详细等界面使用弹出对话框层的方式进 ...
- (转)基于Metronic的Bootstrap开发框架经验总结(6)--对话框及提示框的处理和优化
http://www.cnblogs.com/wuhuacong/p/4775282.html 在各种Web开发过程中,对话框和提示框的处理是很常见的一种界面处理技术,用得好,可以给用户很好的页面体验 ...
- 【转】js弹出框、对话框、提示框、弹窗总结
js弹出框.对话框.提示框.弹窗总结 一.js的三种最常见的对话框 //====================== JS最常用三种弹出对话框 ======================== //弹 ...
- js js弹出框、对话框、提示框、弹窗总结
js弹出框.对话框.提示框.弹窗总结 一.JS的三种最常见的对话框 //====================== JS最常用三种弹出对话框 ======================== //弹 ...
- js弹出框、对话框、提示框、弹窗总结
一.JS的三种最常见的对话框 //====================== JS最常用三种弹出对话框 ======================== //弹出对话框并输出一段提示信息 funct ...
- bootstrap 弹窗或者提示框插件 bootstrap-growl 和bootstrap-notify
Bootstrap简单好用的页面右上角咆哮提示框 - daidaineteasy的专栏 - CSDN博客https://blog.csdn.net/daidaineteasy/article/deta ...
- 转载 js弹出框、对话框、提示框、弹窗总结
转载:https://blog.csdn.net/huileiforever/article/details/9464659 一.JS的三种最常见的对话框 //================== ...
- JavaScript学习总结(6)——js弹出框、对话框、提示框、弹窗总结
一.JS的三种最常见的对话框 [javascript] view plaincopy //====================== JS最常用三种弹出对话框 =================== ...
- 奥展项目笔记06--js弹出框、对话框、提示框、弹窗总结
JS的三种最常见的对话框: //====================== JS最常用三种弹出对话框 ======================== //弹出对话框并输出一段提示信息 functi ...
随机推荐
- Linux预处理、编译、汇编、链接和运行的过程(包括一些基本的命令)
转自Quinn0918的博客 一.预编译 1.将所有的#define删除,并展开所有的宏定义: 2.处理所有的预编译指令,例如:#if,#elif,#else,#endif; 3.处理#include ...
- 自省 另外一种python 生成随机在base36 之间的兑换码生成。
放假无聊,翻看自己博客的时候发现自己前面写的 那个base36兑换码在翻阅的时候 想到一个更简单的办法实现.但是随机上来说可能没有前者那么高 但是觉得也没有多大的问题 发上来 自己再想想 import ...
- ultraEdit MAC 破解方法
安装了个UltraEdit 但是需要验证码,太麻烦了,破解方法: 拷贝附件(command +c )然后在MAC的底下点击访达==>应用程序==>UltraEdit==>右击 显示包 ...
- 线性代数的本质与几何意义 01. 向量是什么?(3blue1brown 咪博士 图文注解版)
向量是线性代数最基础.最基本的概念之一,要深入理解线性代数的本质,首先就要搞清楚向量到底是什么? 向量之所以让人迷糊,是因为我们在物理.数学,以及计算机等许多地方都见过它,但又没有彻底弄懂,以至于似是 ...
- codeforces 1051 D. Bicolorings (DP)
D. Bicolorings time limit per test 2 seconds memory limit per test 256 megabytes input standard inpu ...
- [USACO 2010 Open Silver 3.Time Travel]——链表
Description 约翰得到了一台时光机,他可以用这台机器回到过去(但不能到未来),改变他家的牛群.约翰 打算依次进行 N 步操作,每步操作分为三种: • 买入操作以 a 表示,后接一个参数 i, ...
- BZOJ2653middle——二分答案+可持久化线段树
题目描述 一个长度为n的序列a,设其排过序之后为b,其中位数定义为b[n/2],其中a,b从0开始标号,除法取下整.给你一个 长度为n的序列s.回答Q个这样的询问:s的左端点在[a,b]之间,右端点在 ...
- lightoj1038(数学期望dp)
题意:输入一个数N,N每次被它的任意一个因数所除 变成新的N 这样一直除下去 直到 N变为1 求变成1所期望的次数 解析: d[i] 代表从i除到1的期望步数:那么假设i一共有c个因子(包括1和本身) ...
- MT【23】用算术几何不等式证明数列极限存在
评:如果不需要精确到3,上界的求法可以利用$$(1+\frac{1}{n})^n*\frac{1}{2}*\frac{1}{2}<(\frac{n+\frac{1}{n}*n+\frac{1}{ ...
- python 和 scikit-learn 实现垃圾邮件过滤
文本挖掘(Text Mining,从文字中获取信息)是一个比较宽泛的概念,这一技术在如今每天都有海量文本数据生成的时代越来越受到关注.目前,在机器学习模型的帮助下,包括情绪分析,文件分类,话题分类,文 ...