1.代码:

    <%--登录模态框--%>
<li><a href="#" data-toggle="modal" data-target=".bs-example-modal-lg">登录</a></li>
<!-- Large modal -->
<div id="lgId" class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog"
aria-labelledby="myLargeModalLabel">
<div class="modal-dialog modal-lg " role="document">
<div class="modal-content motai">
<%--登录相关信息--%>
<button type="button" class="btn btn-default remove" onclick="loadPage()">
<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
</button>
<div class="myDiv1">
<div class="micro-class">微辅导</div>
<br/>
<div class="loginTest">
邮箱:<input type="text" id="email"/>
<br/><br/>
密码:<input type="password" id="passWord"/>
<br/><br/>
<button onclick="loginData()">登录</button>
</div>
</div> </div>
</div>
</div>

2.使用说明:

js调用这个模态框:

function methodName(){

$('#lgId').modal('show');

}

bootstrap中模态框的使用的更多相关文章

  1. Bootstrap中模态框多层嵌套时滚动条问题

    在使用Bootstrap中模态框过程中,如果出现多层嵌套的时候,如打开模态框A,然后在A中打开模态框B,在关闭B之后,如果A的内容比较多,滚动条会消失,而变为Body的滚动条,这是由于模态框自带的遮罩 ...

  2. 黄聪:bootstrap中模态框modal在苹果手机上会失效

    bootstrap中模态框在苹果手机上会失效 可将代码修改为<a  data-toggle="modal" data-target="#wrap" hre ...

  3. bootstrap中模态框如果放入form表单中会存在的问题

    bootstrap中模态框如果放入form表单中会存在的问题:当模态框显示时,点回车会出现表单自动提交!!!所以在使用模态框的时候要特别注意!

  4. BootStrap中模态框踩坑

    在模态框中使用html标签上的自定义属性来打开模态框后,在使用JS关闭模态框,就会出现多层蒙板问题 出现这个问题的原因就是没有仔细看bootstrap的官方文档,我人麻了,搞了好久 务必将模态框的 H ...

  5. bootstrap中模态框、模态框的属性

    工作中有需要用到模态框的可以看看 <div class="modal fade" id="userModal" tabindex="-1&quo ...

  6. bootstrap中模态框的大小设置;

    bootstrap模态框调节大小: 大尺寸:黑体加大的字体,是更改的代码 <!-- 大模态框的调节 --> <button type="button" class ...

  7. bootstrap中模态框的大小设置

    <!-- 大模态框的调节 --> <button type="button" class="btn btn-primary" data-tog ...

  8. bootstrap的模态框

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  9. Bootstrap -- 插件: 模态框、滚动监听、标签页

    Bootstrap -- 插件: 模态框.滚动监听.标签页 1. 模态框(Modal): 覆盖在父窗体上的子窗体. 使用模态框: <!DOCTYPE html> <html> ...

随机推荐

  1. HP 4411s Install Red Hat Enterprise Linux 5.8) Wireless Driver

    pick up from http://blog.163.com/wangkangming2008%40126/blog/static/78277928201131994053617/ # cp iw ...

  2. IIS7开启gZip动态压缩

    1.安装动态压缩模块: 安装过程可能的报错:This application has requested the Runtime to terminate it in an unusual way. ...

  3. wamp升级php5.3.10到5.4.31版本

    wamp升级php5.3.10到5.4.31版本 1.  停止WAMP服务器. 2.  去网站windows.php.net 下载php-5.4.31-nts-Win32-VC9-x86.zip. 不 ...

  4. shell of leetcode

    1.Tenth Line How would you print just the 10th line of a file? For example, assume that file.txt has ...

  5. python排序

    排序算法概览 归并排序的 空间复杂度为O(n) 插入排序 基本思想是每次讲一个待排序的记录,按其关键字大小插入到前面已拍好的子序列中,直到全部完成. 直接插入排序 讲元素L(i)插入到有序序列L[1, ...

  6. aliyun centos14.04 trusty 上安装docker1.12.1

    现在apt这边拿到的docker最新版本就是1.12.1 其实本来这次不准备记录了,本以为一帆风顺的安装最后还是遇到了一点坑,aliyun的锅,卡成狗无法下载.青岛机房 1.更新源,然后安装ca-ce ...

  7. Python 面向对象 - 内置类方法

    内置方法  内置方法  说明  __init__(self,...)  初始化对象,在创建新对象时调用  __del__(self)  释放对象,在对象被删除之前调用  __new__(cls,*ar ...

  8. Java生成多数值二元运算结果集

    看之前大学写过的24点程序中用到的核心计算算法——计算四个值能否计算出24,当时用的c++写的,现用Java重写一遍 程序实现了多个数值(可重复),每个数值只能运算一次,二元运算的条件下获得所有结果集 ...

  9. java 反射 子类泛型的class

    很早之前写过利用泛型和反射机制抽象DAO ,对其中获取子类泛型的class一直不是很理解.关键的地方是HibernateBaseDao的构造方法中的 Type genType = getClass() ...

  10. 使用android快速开发框架afinal的FinalDb操作android数据库

    http://my.oschina.net/yangfuhai/blog/87459 今天给大家介绍下#afinal#来操作android的数据库sqlite. #afinal#是一个android的 ...