jQuery UI插件自定义confirm确认框的方法


Posted in Javascript onMarch 20, 2015

本文实例讲述了jQuery UI插件自定义confirm确认框的方法。分享给大家供大家参考。具体分析如下:

这段代码通过jQuery UI自定义了一个confirm的确认对话框效果,通过html代码自定义对话框的显示界面和外观,可以自定义confirm框的按钮,本例中定义了一个confirm确认按钮和一个cancel取消按钮。

html代码

<button id="callConfirm">Confirm!</button>
<div id="dialog" title="Confirmation Required">
 Are you sure about this?
</div>​

jS代码:

$("#dialog").dialog({
  autoOpen: false,
  modal: true,
  buttons : {
    "Confirm" : function() {
      alert("You have confirmed!");
    },
    "Cancel" : function() {
     $(this).dialog("close");
    }
   }
  });
$("#callConfirm").on("click", function(e) {
  e.preventDefault();
  $("#dialog").dialog("open");
});

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
基于jQuery实现表格数据的动态添加与统计的代码
Jan 31 Javascript
jquery阻止冒泡事件使用模拟事件
Sep 06 Javascript
jQuery多媒体插件jQuery Media Plugin使用详解
Dec 19 Javascript
javascript三元运算符用法实例
Apr 16 Javascript
js计算时间差代码【包括计算,天,时,分,秒】
Apr 26 Javascript
浅谈js停止事件冒泡 阻止浏览器的默认行为(阻止超连接 #)
Feb 08 Javascript
Bootstrap页面标题Page Header的实现方法
Mar 22 Javascript
Angular 4.x 路由快速入门学习
May 03 Javascript
详解Angular6.0使用路由步骤(共7步)
Jun 29 Javascript
Angular Excel 导入与导出的实现代码
Apr 17 Javascript
vue webpack重写cookie路径的方法
Jul 10 Javascript
javascript绘制简单钟表效果
Apr 07 Javascript
js使用split函数按照多个字符对字符串进行分割的方法
Mar 20 #Javascript
原生Js实现简易烟花爆炸效果的方法
Mar 20 #Javascript
Javascript调用函数方法的几种方式介绍
Mar 20 #Javascript
初识Node.js
Mar 20 #Javascript
JavaScript Sort 的一个错误用法示例
Mar 20 #Javascript
JS实现的数组全排列输出算法
Mar 19 #Javascript
JavaScript在浏览器标题栏上显示当前日期和时间的方法
Mar 19 #Javascript
You might like
php数组转成json格式的方法
2015/03/09 PHP
学习php设计模式 php实现适配器模式
2015/12/07 PHP
Symfony模板的快捷变量用法实例
2016/03/17 PHP
php中使用GD库做验证码
2016/03/31 PHP
Laravel框架实现model层的增删改查(CURD)操作示例
2018/05/12 PHP
javascript第一课
2007/02/27 Javascript
html数组字符串拼接的最快方法
2009/09/16 Javascript
extJs 常用到的增,删,改,查操作代码
2009/12/28 Javascript
jquery如何改变html标签的样式(两种实现方法)
2013/01/16 Javascript
jquery实现效果比较好的table选中行颜色
2014/03/25 Javascript
nodejs开发微博实例
2015/03/25 NodeJs
轻松学习jQuery插件EasyUI EasyUI创建树形网络(1)
2015/11/30 Javascript
深入理解js generator数据类型
2016/08/16 Javascript
vue制作加载更多功能的正确打开方式
2016/10/12 Javascript
关于RequireJS的简单介绍即使用方法
2016/10/20 Javascript
在React中写一个Animation组件为组件进入和离开加上动画/过度效果
2019/06/24 Javascript
Vue基于iview实现登录密码的显示与隐藏功能
2020/03/06 Javascript
vue-cli 3如何使用vue-bootstrap-datetimepicker日期插件
2021/02/20 Vue.js
[49:35]2018DOTA2亚洲邀请赛3月30日 小组赛A组 KG VS TNC
2018/03/31 DOTA
Django实现单用户登录的方法示例
2019/03/28 Python
PYQT5设置textEdit自动滚屏的方法
2019/06/14 Python
pandas的排序和排名的具体使用
2019/07/31 Python
OpenCV模板匹配matchTemplate的实现
2019/10/18 Python
TensorFlow使用Graph的基本操作的实现
2020/04/22 Python
css3中的calc函数浅析
2018/07/10 HTML / CSS
Tommy Hilfiger美国官网:美国高端休闲领导品牌
2019/01/14 全球购物
热能动力工程毕业生自荐信
2013/11/07 职场文书
大学生求职信
2014/06/17 职场文书
英文感谢信格式
2015/01/21 职场文书
任命书标准格式
2015/03/02 职场文书
亮剑观后感
2015/06/05 职场文书
独生子女证明范本
2015/06/19 职场文书
领导新年致辞2016
2015/07/29 职场文书
详解MySQL主从复制及读写分离
2021/05/07 MySQL
MySQL COUNT函数的使用与优化
2021/05/10 MySQL
超越Nginx的Web服务器caddy优雅用法
2022/06/21 Servers