artDialog对话框在PHP下的简单应用-artDialog确认取消对话框的制作代码

使用artDialog做确认取消操作,本教程以删除操作为例,点击按钮,弹出确认取消对话框,点击确认按钮,执行删除操作,点击取消按钮则取消本次操作。

要实现这个操作有2种方法,使用artDialog的iframe扩展来做和不使用iframe扩展。如果使用iframe,则要在页面中载入

<script src="artDialog/plugins/iframeTools.source.js"></script>

index.html中的代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>artDialog对话框在PHP下的简单应用-artDialog确认取消对话框的制作代码</title> 
<style> 
body { 
    font-size: 12px; 
} 
</style> 
<script src="jiaocheng.js"></script>  
<script src="artDialog/artDialog.source.js?skin=default"></script>  
<script src="artDialog/plugins/iframeTools.source.js"></script> 
</head> 
 
<body> 
<a href="#" onclick="DelSel()">弹出确认对话框1</a><br/> 
<a href="#" onclick="DelSel2()">弹出确认对话框2</a> 
</body> 
</html> 

index.php代码:

<?php 
$text=$_GET['text']; 
if ($text=='test') 
{ 
echo 'chenggong'; 
} 
else 
{ 
echo 'shibai'; 
} 
?> 

jiaocheng.js中的代码:

//使用iframe扩展
function DelSel(){ 
   art.dialog.confirm('你确定要删除这些文件吗?', function () { 
   this.close(); 
   $.ajax({ 
    type: 'get', 
    url: 'index.php?text=test', 
    contentType: 'text/html;charset=utf-8', 
    success: function(data, status) { 
      switch (data) {  
      case 'chenggong': 
        art.dialog.tips('成功删除'); 
        break; 
      default: 
        art.dialog.tips('删除失败'); 
      } 
      return false; 
    } 
  }); 
  return false; 
}, function () { 
    art.dialog.tips('你取消了操作'); 
});  
} 
//不使用iframe扩展方法
function DelSel2(){ 
   art.dialog({ 
    id:'del', 
    content: '你确定要删除这些文件吗?', 
    ok: function () { 
    $.ajax({ 
    type: 'get', 
    url: 'index.php?text=test', 
    contentType: 'text/html;charset=utf-8', 
    success: function(data, status) { 
      switch (data) {  
      case 'chenggong': 
        parent.art.dialog.list['del'].close(); 
        art.dialog({ 
        id: 'testID1', 
        content: '删除成功' 
        }); 
        art.dialog({id: 'testID1'}).time(1); 
        break; 
      default: 
        parent.art.dialog.list['del'].close(); 
        art.dialog({ 
        id: 'testID1', 
        content: '删除失败' 
        }); 
        art.dialog({id: 'testID1'}).time(1); 
      } 
      return false; 
    } 
  }); 
        return false; 
    }, 
    cancelVal: '取消', 
    cancel: true //为true等价于function(){} 
}); 
} 

具体可以下载附件中的例子来学习。

附件下载:http://www.daimajiayuan.com/download/201304/file/16574.rar

artDialog4.1.7下载地址:http://www.daimajiayuan.com/sitejs-16571-1.html

更多PHP教程请访问JS代码

本文原地址:http://www.daimajiayuan.com/sitejs-16574-1.html

转载于:https://www.cnblogs.com/sitejs/archive/2013/05/04/3058941.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
[更新列表] ------------------------------------------------------------------------------------------------ v2.1.1 1、修复IE6静止定位的对话框导致页面变长的问题 v2.1.0 1、 增加menuBtn参数, 支持让对话框在指定元素附近弹出(菜单模式) 2、 剔除鸡肋参数'parent',框架相互调用请用javascript原生方法 3、 剔除对话框关闭后回调函数,如果需要使用请使用内置扩展方法 4、 如果有取消按钮回调函数,那关闭按钮的回调函数也将与其相同 5、 增加当出现多个对话框时让顶层的与众不同的特性 6、 让Esc键关闭最高层对话框 7、 锁屏的时候改用js屏蔽页面滚动功能,取消原来CSS隐藏滚动条,防止页面偏移 8、 给确定按钮增加Ctrl + Enter快捷键,锁屏的时候支持tab与方向键切换按钮焦点 9、 锁屏的时候屏蔽了键盘操作刷新、Tab切换(只在对话框中可用)与全选 10、修复Chrome特定情况下出现的iframe错位问题 11、修正2.0.8版本后锁屏不兼容Safari的问题 12、修复Firefox调大对话框拖帧的现象 13、修复拖动对话框时候可能因鼠标置入iframe窗口而导致鼠标被粘住的问题 14、修复了内部$.newId方法的一处错误,特定情况下导致定义了ID的对话框无法弹出 15、删除脚本对IE6 png bug内置支持,之前测试版本自动修复ie6 png皮肤是因为作者偷懒 16、修改aero皮肤CSS、针对IE6单独兼容,减少之前脚本修复png占用过多的客户端资源 17、默认皮肤改为前版的mini,没有使用任何背景图片,完全用css表现 18、修复一处隐秘BUG:当使用Ctrl+回车提交表单并弹出对话框时导致弹出新窗口 (因为此时焦点在对话框关闭链接上,这个快捷键让很多浏览器新建窗口) 19、重新绘制'earo'皮肤,修复毛边的问题 20、修复拖动的时候出现选中文本的现象(自动清除选择) 21、如果对话框高度超过浏览器视口的一半高度则不使用黄金比例垂直居中 22、修复了IE7通过url参数创建的iframe可能出现边框线的小问题 23、为了后续版能够提更多接口(小巧而强大的),想了很久狠心改了调用名:art.dialog(); 24、既然连入口都改了,那再改下配置名(为了后续可能的拓展): 'url'参数名改为'iframe' 25、可以自适应iframe内容的大小(不跨域的前提下) 26、对超过预设面积大小的对话框拖动自动采用替身的方式,以求拖动更流畅 27、新增加一个'data'的接口,它保存了你对话框每次创建的消息对象 (操作iframe消息将更加方便,如提交iframe表单。稍后添加更多的例子..) 28、对于简单的消息可以使用简写: artDialog('hello world') 29、让IE6支持覆盖下拉控件的同时也支持透明皮肤 30、优化锁屏渐变动画 31、修复范围限制函数没有生效的错误 32、修复一处笔误,忘记声明变量导致泄漏出去污染全局 v2.0.9 1、 优化代码结构,弹出后仍可访问内部方法(如关闭),大大增强了灵活性 2、 修正IE7锁屏的时候滚动条没有禁止的问题 3、 让焦点自动附加到确定按钮或者关闭按钮 v2.0.8 1、 修正超大对话框并使用定位时候可能被截取的BUG 2、 修复Opera无法正确处理对话框叠加高度(z-index)的BUG 3、 修复Opera设置坐标时候出现的变形BUG v2.0.7 1、 url参数加载外部页面的时候显示loading动画 2、 预加载皮肤背景图片 3、 优化拖动 v2.0.6 1、 解决页面载入即弹出的情况造成水平对齐不正常的BUG(主要是dom ready事件 绑定) 2、 增加parent参数,支持对话框穿越框架在父页面弹出 v2.0.5 1、 剔除yesClose参数,如果要点击确定或者取消按钮不自动关闭对话框,让回调 函数返回false即可 2、 更改x参数名为left,y为top,为后续版本拓展right与bottom参数需要 3、 修改皮肤aero和chrome的图标布局,让回行消息文本留出图标的宽度 v2.0.4 1、 修改一小处兼容框架样式,防止调用页面body设置了文本对齐导致对话框标题文 本也居中 v2.0.3 1、 增加id参数,可以方便外部脚本控制整个对话框,同时可防止对话框重复弹出 2、 增加yesClose参数,用于阻止对话框点击确定后自动关闭 v2.0.0 ...
### 回答1: artdialog 4.1.7是一个弹窗插件,用于在网页中实现弹窗效果。它基于jQuery开发,可以方便地在网页中创建各种类型的弹窗,例如提示框、确认框和消息框等。 artdialog 4.1.7具有如下特点: 1. 界面美观:artdialog提供了丰富的样式和主题,可以根据需求进行自定义,使弹窗界面更加美观和吸引人。 2. 功能强大:除了基本的弹窗功能外,artdialog还支持自定义按钮、可拖拽、可改变大小等高级功能,让弹窗更加灵活和实用。 3. 兼容性好:artdialog兼容主流浏览器,包括IE6+、Chrome、Firefox等,可以在各种浏览器中稳定运行。 4. 使用简便:artdialog提供了简洁的API接口和详细的文档说明,用户可以很容易地集成和使用该插件,无需编写复杂的代码。 5. 开源免费:artdialog是一个开源项目,用户可以免费获取和使用它,可以通过GitHub等平台获取最新版本的代码和文档。 总而言之,artdialog 4.1.7是一个功能强大、界面美观、使用简便的弹窗插件,可以满足用户在网页中创建各种类型弹窗的需求,是一个非常实用的网页开发工具。 ### 回答2: artdialog 4.1.7 是一个开源的对话框插件,用于在网站开发中实现弹出对话框的功能。它基于jQuery库开发,使得创建和管理对话框变得非常简单和方便。 artdialog 4.1.7 提供了丰富的配置选项,可以自定义对话框的样式和行为。你可以设置对话框的标题、内容、按钮以及弹出方式等。同时,它还支持自定义皮肤,可以让对话框的外观更加符合你的网站设计。 此外,artdialog 4.1.7 还具有良好的兼容性,可以在各种主流浏览器中正常工作。它还支持多种类型的内容,包括文本、HTML、图片和网页等。这使得你可以根据需要在对话框中显示各种形式的内容。 artdialog 4.1.7 具有简单易用的API,可以通过调用相应的方法来控制对话框的出现和消失。你可以通过JavaScript代码来触发对话框的显示和隐藏,也可以通过回调函数来处理用户对对话框的交互。 总体而言,artdialog 4.1.7 是一个功能强大、易于使用的对话框插件,适用于各种网站开发需求。它不仅提供了丰富的配置选项和自定义皮肤功能,还具有良好的兼容性和灵活的API接口。无论是弹出提示信息、确认对话框还是显示复杂的内容,artdialog 4.1.7 都能满足你的需求,为用户提供良好的交互体验。 ### 回答3: ArtDialog是一个弹窗组件,版本4.1.7是该组件的一个特定版本。ArtDialog能够以对话框的形式在网页中弹出各种内容,例如通知、警告、确认等。它具有灵活的自定义功能,能够根据用户的需求进行不同样式的设计和布局。ArtDialog支持简化的接口调用,使用方便,同时还具有丰富的配置选项,可以调整弹窗的大小、位置、效果等属性。此外,ArtDialog还提供了丰富的API,可以通过编程的方式控制弹窗的行为,比如设置定时关闭、禁用指定选项、自定义按钮等。ArtDialog还支持国际化,可以根据用户的语言环境显示相应的文字。ArtDialog的使用也很广泛,可以在各种网页开发项目中灵活应用,提升用户的交互体验。总的来说,ArtDialog 4.1.7是一个功能强大、灵活性高、使用方便的弹窗组件,适用于各种网页开发项目。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值