bootstrap style for jQuery UI Dialog
页面引用:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link href="css/jquery-ui-bootstrap-v0.5pre/css/custom-theme/jquery-ui-1.10.0.custom.css" rel="stylesheet" />
<link href="css/bootstrap.min.css" rel="stylesheet" />
<script src="js/jquery-1.11.0.min.js"></script>
<script src="js/jquery-ui-1.10.4.min.js"></script>
</head>
<body>
<div id="dialog">asdfasdf</div>
<script type="text/javascript">
$(function () {
$("#dialog").dialog({
width: 500,
height: 400,
autoOpen: true,
resizable: false,
buttons: [
{
id: "okaybutton",
text: "okay"
},
{
id: "nookaybutton",
text: "nookay"
},
{
id: 'checkboxplaceholder',
text: "勾选框",
}
],
open: function () {
$("#okaybutton").removeClass("ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only")
.addClass("btn btn-primary"); $("#nookaybutton").removeClass("ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only")
.addClass("btn btn-default"); //replace send email button with a checkbox
$("#checkboxplaceholder").replaceWith("<label class='sendEmailText' for='sendEmailCheckBox'>发送邮件提醒</label><input type='checkbox' class='sendEmailCheckBox' id='sendEmailCheckBox' checked />");
}
});
});
</script> <style type="text/css">
.saveAndCreateNext {
background-color: black !important;
} .sendEmailCheckBox {
position: absolute;
left: 20px;
margin-top: 17px !important;
} .sendEmailText {
position: absolute;
margin-top: 15px;
left: 40px;
color: #333333;
}
</style>
</body>
</html>
按照头中的路径引用到对应文件(jquery-ui-bootstrap-v0.5pre\css\custom-theme路径下会有images图片,勿忘)
效果如下:

提交时用checkbox的id拿对应的值(var isSendEmail = $("#sendEmailCheckBox").prop("checked"););
bootstrap style for jQuery UI Dialog的更多相关文章
- [转]jQuery UI Dialog Modal Popup Yes No Confirm example in ASP.Net
本文转自:http://www.aspsnippets.com/Articles/jQuery-UI-Dialog-Modal-Popup-Yes-No-Confirm-example-in-ASPN ...
- jQuery UI dialog 的使用
今天用到了客户端的对话框,把 jQuery UI 中的对话框学习了一下. 准备 jQuery 环境 首先,我们创建一个按钮,点击这个按钮的时候,将会弹出一个对话框. 1 <input type= ...
- Jquery - UI - Dialog(转)
jQuery UI Dialog常用的参数有: 1.autoOpen:默认true,即dialog方法创建就显示对话框 2.buttons:默认无,用于设置显示的按钮,可以是JSON和Array形式: ...
- 解决Select2控件不能在jQuery UI Dialog中不能搜索的bug
本文使用博客园Markdown编辑器进行编辑 1.问题呈现 项目中使用了jQuery UI的Dialog控件,一般用来处理需要提示用户输入或操作的简单页面.逻辑是修改一个广告的图片和标题. 效果截图如 ...
- API分析——Jquery UI Dialog
1.阅读API文档的一般方法? 通常地, API由三部分构成:属性.方法.事件. 属性表示参数配置,作为一个组件的微调,或者功能的开启与关闭: 方法表示组件能够发生的动作,或者组件的状态监测: 事件表 ...
- jQuery UI dialog 參数说明
前段时间碰到个问题 jquery UI dialog弹出层 弹出多个层是 比方弹出两个层A和B B层假设显示的数据表格太大,伸到了A层的外面,那伸到A层之外的部分就看不到了,由于B层是在A层上弹出的 ...
- jQuery UI dialog 参数说明
前段时间碰到个问题 jquery UI dialog弹出层 弹出多个层是 比如弹出两个层A和B B层如果显示的数据表格太大,伸到了A层的外面,那伸到A层之外的部分就看不到了,因为B层是在A层上弹出的 ...
- JQuery UI dialog 弹窗实例及参数说明
按钮代码: <a id="suprise" style="margin-left: 0.5em;cursor:pointer;">点我会有惊喜< ...
- jQuery UI dialog
初始化参数 对于 dialog 来说,首先需要进行初始化,在调用 dialog 函数的时候,如果没有传递参数,或者传递了一个对象,那么就表示在初始化一个对话框. 没有参数,表示按照默认的设置初始化对话 ...
随机推荐
- MySql 存储过程及调用方法
存储过程实例: DELIMITER $$drop procedure if exists ff $$CREATE /*[DEFINER = { user | CURRENT_USER }]*/ PRO ...
- React JSX语法说明
原文:http://my.oschina.net/leogao0816/blog/379487 什么是JSX? 在用React写组件的时候,通常会用到JSX语法,粗看上去,像是在Javascript代 ...
- VirtrualBox使用已存在的镜像创建虚拟机
再将一个已经存在的虚拟机镜像拷贝为另一个新的虚拟机镜像后,要将该新的镜像添加到新的虚拟机中时会出现错误提示,从而导致不能创建虚拟机.例如有'D:\App\VirtualBox VMs\CentOS_6 ...
- Disruptor 极速体验
已经不记得最早接触到 Disruptor 是什么时候了,只记得发现它的时候它是以具有闪电般的速度被介绍的.于是在脑子里, Disruptor 和"闪电"一词关联了起来,然而却一直没 ...
- Android 组件类继承关系结构图
- nyoj 881 小M的区间公约数
点击打开链接 首先给的范围很大,是10^9.暴力解肯定超时(单用for循环到10^9都大约要2s-3s),首先写了个程序暴力的把两个数所有的约数都打印出来,最后发现所有的公约数都是最大公约数的约数,并 ...
- 异常:“System.Reflection.Metadata”已拥有为“System.Collections.Immutable”定义的依赖项
参考动态执行T4模板:https://msdn.microsoft.com/zh-cn/library/bb126579.aspx 我项目是.NET Framework 4.5控制台应用程序写的. 执 ...
- HTML5服务器推送消息的各种解决办法
摘要 在各种BS架构的应用程序中,往往都希望服务端能够主动地向客户端推送各种消息,以达到类似于邮件.消息.待办事项等通知. 往BS架构本身存在的问题就是,服务器一直采用的是一问一答的机制.这就意味着如 ...
- sqlite读取中文乱码(C#)
C#读取一些C++创建的sqlite数据库时乱码, C++保存DB是用GB2312编码的, C#调用的官方的system.data.sqlite是用的UTF-8编码的, 在读取时会乱码, 用一个GB ...
- VMWare虚拟机 使用vmtools拷贝文件 临时文件问题
Win7下, 临时文件会存放在路径C:\Users\admin\AppData\Local\Temp\vmware-admin\VMwareDnD,如果不及时删除,C盘就会越来越大直至放满.