首页 > 语言 > JavaScript > 正文

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

2024-05-06 16:17:19
字体:
来源:转载
供稿:网友

这篇文章主要介绍了jQuery UI插件自定义confirm确认框的方法,实例分析了jQuery的UI插件使用技巧,非常具有实用价值,需要的朋友可以参考下

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

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

html代码

 

 
  1. <button id="callConfirm">Confirm!</button> 
  2. <div id="dialog" title="Confirmation Required"
  3. Are you sure about this
  4. </div>​ 

jS代码:

 

 
  1. $("#dialog").dialog({ 
  2. autoOpen: false
  3. modal: true
  4. buttons : { 
  5. "Confirm" : function() { 
  6. alert("You have confirmed!"); 
  7. }, 
  8. "Cancel" : function() { 
  9. $(this).dialog("close"); 
  10. }); 
  11. $("#callConfirm").on("click"function(e) { 
  12. e.preventDefault(); 
  13. $("#dialog").dialog("open"); 
  14. }); 

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

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选