源模态框使用: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">&times;</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 --对话框及提示框的处理和优化的更多相关文章

  1. 基于Metronic的Bootstrap开发框架经验总结(6)--对话框及提示框的处理和优化

    在各种Web开发过程中,对话框和提示框的处理是很常见的一种界面处理技术,用得好,可以给用户很好的页面体验,Bootstrap开发也一样,我们往往在页面新增.编辑.查看详细等界面使用弹出对话框层的方式进 ...

  2. (转)基于Metronic的Bootstrap开发框架经验总结(6)--对话框及提示框的处理和优化

    http://www.cnblogs.com/wuhuacong/p/4775282.html 在各种Web开发过程中,对话框和提示框的处理是很常见的一种界面处理技术,用得好,可以给用户很好的页面体验 ...

  3. 【转】js弹出框、对话框、提示框、弹窗总结

    js弹出框.对话框.提示框.弹窗总结 一.js的三种最常见的对话框 //====================== JS最常用三种弹出对话框 ======================== //弹 ...

  4. js js弹出框、对话框、提示框、弹窗总结

    js弹出框.对话框.提示框.弹窗总结 一.JS的三种最常见的对话框 //====================== JS最常用三种弹出对话框 ======================== //弹 ...

  5. js弹出框、对话框、提示框、弹窗总结

    一.JS的三种最常见的对话框 //====================== JS最常用三种弹出对话框 ======================== //弹出对话框并输出一段提示信息 funct ...

  6. bootstrap 弹窗或者提示框插件 bootstrap-growl 和bootstrap-notify

    Bootstrap简单好用的页面右上角咆哮提示框 - daidaineteasy的专栏 - CSDN博客https://blog.csdn.net/daidaineteasy/article/deta ...

  7. 转载 js弹出框、对话框、提示框、弹窗总结

    转载:https://blog.csdn.net/huileiforever/article/details/9464659 一.JS的三种最常见的对话框   //================== ...

  8. JavaScript学习总结(6)——js弹出框、对话框、提示框、弹窗总结

    一.JS的三种最常见的对话框 [javascript] view plaincopy //====================== JS最常用三种弹出对话框 =================== ...

  9. 奥展项目笔记06--js弹出框、对话框、提示框、弹窗总结

    JS的三种最常见的对话框: //====================== JS最常用三种弹出对话框 ======================== //弹出对话框并输出一段提示信息 functi ...

随机推荐

  1. windows上面链接使用linux上面的docker daemon

    1. 修改linux 上面的 docker的 配置文件. vim /usr/lib/systemd/system/docker.service 注意 这个是centos的路径 发现ubuntu的路径不 ...

  2. Qt__QMessageBox

    转自豆子空间 显示窗口 Qt提供了五个类似的接口,用于显示类似的窗口. QMessageBox::information(NULL, "Title", "Content& ...

  3. python对redis的常用操作 上 (对列表、字符串、散列结构操作)

    这里的一切讨论均基于python的redis-py库. 安装使用: pip install redis 然后去获取一个redis客户端: redis_conn = redis.Redis(host=R ...

  4. 自省 另外一种python 生成随机在base36 之间的兑换码生成。

    放假无聊,翻看自己博客的时候发现自己前面写的 那个base36兑换码在翻阅的时候 想到一个更简单的办法实现.但是随机上来说可能没有前者那么高 但是觉得也没有多大的问题 发上来 自己再想想 import ...

  5. Oracle中rownum和rowid的理解

    rownum,rowid都叫伪列. 但是,rownum是逻辑上的编号,且其值总是从1开始,每行的rounum不是固定的.而rowid是“物理”编号.若数据库文件没有移动,则每行的 rowid一般是固定 ...

  6. python—— 写入错误UnicodeEncodeError的解决办法

    在写python爬虫过程中,有时候吧结果写入到txt文件,但是会遇到UnicodeEncodeError. 错误原因—— 把文件内容,写入到文件中时,出错了. 而出错的原因其实是,python系统,在 ...

  7. 自学Zabbix12.1 Zabbix命令-zabbix_server

    点击返回:自学Zabbix之路 点击返回:自学Zabbix4.0之路 点击返回:自学zabbix集锦 自学Zabbix12.1 Zabbix命令-zabbix_server 1. zabbix核心:z ...

  8. 自学Zabbix之路15.4 Zabbix数据库表结构简单解析-Expressions表、Media表、 Events表

    点击返回:自学Zabbix之路 点击返回:自学Zabbix4.0之路 点击返回:自学zabbix集锦 自学Zabbix之路15.4 Zabbix数据库表结构简单解析-Expressions表.Medi ...

  9. bzoj5280/luogu4376 MilkingOrder (二分答案+拓扑序)

    二分答案建图,然后判环,就可以了. 字典序输出的话,只要做拓扑序的时候用优先队列来维护就可以了. (其实判环也可以用拓扑序...) #include<cstdio> #include< ...

  10. Java:终于找到了在alloy中的JFileChooser中的弹出式菜单不显示文字的解决办法

    alloy界面可以说是我写过的最漂亮的一种JAVA界面. 可惜不知为什么,至从几年前推出1.4版后,就再也没有更新了. 随着java版本的升级,一直很担心alloy有一天不再适用于java的最新版. ...