artdialog弹窗插件 气泡提示

artdialog适合做弹出的复杂页面,重量级。jquery通知插件jNotify,正确,错误,警告等,秒自动关闭
artDialog 是一个轻巧且高度兼容的javascript对话框组件,可让你的网页交互拥有桌面软件般的用户体验。

artDialog4

两个页面的交互:A页面:点击上传图片,弹出B页面并传递一个ID过去,

Java代码  artdialog弹窗插件 气泡提示
  1. //上传图片  
  2. $("#UpImg").click(function() {  
  3.     if($("#ddlHotelList").val()!="-选择酒店-"){  
  4.     $(this).attr('disabled'false);  
  5.         // 把hotelId传递给图片上传页面  
  6.         art.dialog.data('hotelId', $("#lblHotelID").html()); // 存储数据  
  7.         art.dialog.open('/SystemManage/Hotel/ImageUp.aspx', {  
  8.             id: 'AAA',  
  9.             close: function() {  
  10.                 var bValue = art.dialog.data('returnHotelId'); // 读取页面返回的数据  
  11.                 if (bValue !== undefined){  
  12.                    alert("我回来了:"+bValue);  
  13.                 }  
  14.             }  
  15.         },  
  16.         false);  
  17.     }  
  18. }  

B页面:点击确定按钮,关闭并返回一个参数到主界面。

Java代码  artdialog弹窗插件 气泡提示
  1. <script src="/js/jquery1.7.0.js" type="text/javascript"></script>  
  2. <script src="/artDialog/jquery.artDialog.source.js" type="text/javascript"></script>  
  3. <script src="/artDialog/plugins/iframeTools.source.js" type="text/javascript"></script>  
  4. <script type="text/javascript">  
  5.       $(function(){  
  6.         alert("这是从主页过来的酒店ID:"+art.dialog.data('hotelId'));// 获取由主页面传递过来的数据  
  7.         $("#butOk").click(function(){  
  8.            art.dialog.data('returnHotelId', art.dialog.data('hotelId'));// 存储数据  
  9.            art.dialog.close();  
  10.         });  
  11.       })  
  12. </script>  

iframe中使用jQuery

Java代码  artdialog弹窗插件 气泡提示
  1. art.dialog.open(url, {title: title, height: height, width: width, lock: true, window: "top",  
  2.     ok: function (iframeWin, topWin) {  
  3.         iframeWin.$('#dosubmit').click(function(){});  
  4.         return false;  
  5.     }  
  6. });  

 artDialog6

Java代码  artdialog弹窗插件 气泡提示
  1. function confirmDel(oid) {//多个参数  
  2.     dialog_confirm_callBack('确定要取消吗', orderCallback, {orderId: oid});  
  3. }  
  4.   
  5. function orderCallback(data) {  
  6.     var dialogObj = this;  
  7.     $.ajax({  
  8.         type: "get",  
  9.         url: "<?php echo $this->createUrl('/pc/ajax/orders')?>",  
  10.         data: {id: data.orderId, op: 'cancel'},  
  11.         dataType: "json",  
  12.         success: function (msg) {  
  13.             dialogObj.content('取消订单成功!');  
  14.             window.location.reload();  
  15.         }  
  16.     })  
  17. }  
 
 
上一篇:阿里开源分布式限流框架 -Sentinel Go 0.3.0 发布,支持熔断降级能力


下一篇:SuperScript —— 基于 Node.js 的聊天机器人