bootstrap模态对话框(最简单)
根据公司的需求，需要一个对话框来返回给客户的失败原因，刚刚开在百度上搜了老半天，嫩是没有搜索一个自己想要的，后来发送私信给一个博友，经过他哪里找到了自己想要的答案，废话不多说直接看源码：
<!DOCTYPE html>
<html>
<head>
<title>Bootstrap 实例 - 模态框（Modal）插件</title>
<link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
</head>
<body> <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">
<input type="text"/>
在这里添加一些文本
</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>
</body>
</html>
或者http://www.runoob.com/bootstrap/bootstrap-modal-plugin.html进这个网站
或者直接百度搜索:bootstrap的modal框
bootstrap模态对话框(最简单)的更多相关文章
- Bootstrap 模态对话框只加载一次 remote 数据的解决办法 转载
http://my.oschina.net/qczhang/blog/190215 摘要 前端框架 Bootstrap 的模态对话框,可以使用 remote 选项指定一个 URL,这样对话框在第一次弹 ...
- bootstrap模态对话框
bootstrap模态对话框 前提是引入bootstrap的css和js的东西 data-backdrop="static"代表的是点击旁边的内容,不进行关闭操作,但是esc的时候 ...
- 为Bootstrap模态对话框添加拖拽移动功能
请自行下载使用到的Bootstrap库及jQuery库 <!DOCTYPE html> <html> <head lang="en"> < ...
- JavaScript：bootstrap 模态框的简单应用
最近用上了bootstrap这个强大的前端框架,有空来总结一下.这里记录下模态框的简单应用. 首先,要在页面中引入相应的js.css文件 <link href="css/bootstr ...
- HTML bootstrap 模态对话框添加用户
HTML 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> ...
- Bootstrap 模态对话框 remote指定内容加载
第一个页面: .....其他内容..... <div class="modal" id="ID_ReformDetail"> <div cla ...
- Bootstrap 模态对话框只加载一次 remote 数据的解决办法
原文: https://my.oschina.net/qczhang/blog/190215?p=1
- [原]经典bootstrap模态框使用文章
1,Bootstrap 模态对话框和简单使用 <div id="myModal" class="modal hide fade"> <div ...
- 基于bootstrap模态框的二次封装
一.参数设置 $.beamDialog(options); var defaults = { title:'标题', content:'内容', showCloseButton:true, //显示关 ...
随机推荐
- RHEL6安装python包tornado
RHEL6安装python包tornado tornado是使用Python开发的全栈式(full-stack)Web框架和异步网络库,最早由Friendfeed开发.通过使用非阻塞IO,Tornad ...
- Android SDK下载失败的解决方法
Android SDK下载失败的解决方法 图1 在下载过程中,Android SDK Manager Log中出现下面出错信息: Preparing toinstall archives Downlo ...
- STL - vector容器
1Vector容器简介 vector是将元素置于一个动态数组中加以管理的容器. vector可以随机存取元素(支持索引值直接存取, 用[]操作符或at()方法,这个等下会详讲). vector尾部添加 ...
- Android Hal 分析
本文是基于android4.0.3.对应其他低版本的代码,可能有所差异,但基本大同小异. Android的HAL是为了保护一些硬件提供商的知识产权而提出的,是为了避开linux的GPL束缚.思路是把控 ...
- utl_file包的使用
首先看一下oracle 脚本 /* # $Header: HTMomse12.sql 12.0.4 20121015 Support $ #+============================= ...
- linux内核算法---hex_to_bin分享
这是我从内核抠出来的一段代码,用处就是传入一个字符,即可以用printf语句%d以十进制数的格式输出,同时也可以以%p地址的形式输出. 代码如下: #include <stdio.h> # ...
- 一个简单的基于 DirectShow 的播放器 1（封装类）
DirectShow最主要的功能就是播放视频,在这里介绍一个简单的基于DirectShow的播放器的例子,是用MFC做的,今后有机会可以基于该播放器开发更复杂的播放器软件. 注:该例子取自于<D ...
- Volley网络框架完全解析（缓存篇）
在上一篇中讲完了Volley框架怎么使用,那么这篇就来讲讲Volley框架的缓存机制 我们看Volley内部源码发现: Volley框架内部自己处理了DiskBasedCache硬盘缓存,但是没有处理 ...
- redis注册成window服务
注册服务 redis-server.exe –service-install redis.windows.conf 删除服务 redis-server –service-uninstall 开启服务 ...
- Xcode使用心得01:断点中断问题和调整编译目标
在obj-c系列博文里,我们粗浅的介绍了obj-c的一些语法以及F库中的一些标准类的使用,但是实际编写拿得出手的APP还是得老老实实在os x上用Xcode写啊!最近上网无意中发现还有支持os x和i ...