jquery.boxy插件的iframe扩展代码


Posted in Javascript onJuly 02, 2010
/* 
<a href="a.html" onclick="return $.qbox(this);" > 
<a href="a.html" onclick="return qBox.iFLoad(this);" > 
<a href="a.html" onclick="return qBox.iFrame({src:'b.html'})" > Boxy属性不变 新增 w、h、src 属性 
qBox.Close();关闭当前窗口 
qBox.iFSrc({}); 改变当前窗口的属性及指向 Boxy属性不变 新增 w、h、src 属性 
*/ //Boxy插件的扩展 
jQuery.fn.qbox=function(options){ 
var node = this.get(0).nodeName.toLowerCase(); 
var self=this; 
if (node == 'a') { 
$(this).attr('onclick','').unbind('click').click(function(){return false;}); 
options = $.extend(options||{},{src:this.get(0).getAttribute('href'),beforeUnload:function(){ $(self).unbind('click').click(function(){return $(this).qbox(options);});}}); 
} 
qBox.iFLoad(options); 
return false; 
} 
var qBox=function(){}; 
jQuery.extend(qBox,{ 
aDgs:[], 
iFrame:function(op){ 
op = jQuery.extend({title:'提示',w:320,h:200,src:'about:blank',modal:false,fixed:false,unloadOnHide:true},op),fm=parseInt(Math.random()*(1000*987));// 
var dialog = new Boxy("<b id=\"ld"+fm+"\">正在加载,请稍后....</b><iframe id=\"_"+fm+"\" style=\"width:0;height:0;display:none;padding:0;\" src="+op.src+" frameborder=\"0\" scrolling=\"no\"></iframe>",op); 
jQuery("#_"+fm).load(function(){ 
dialog.resize(op.w,op.h,function(){}); 
jQuery("#ld"+fm).remove(); 
jQuery("#_"+fm).css({'padding':'15px','display':''}); 
}); 
qBox.aDgs.push(dialog); 
return false; 
}, 
Close:function(){ 
qBox.aDgs[qBox.aDgs.length-1].hide(); 
return false 
}, 
iFSrc:function(op){ 
op = jQuery.extend({w:320,h:200,src:'about:blank'},op); 
qBox.aDgs[qBox.aDgs.length-1].getContent().attr("src","about:blank"); 
qBox.aDgs[qBox.aDgs.length-1].setTitle(op.t); 
qBox.aDgs[qBox.aDgs.length-1].tween(op.w,op.h,function(){qBox.aDgs[qBox.aDgs.length-1].getContent().attr("src",op.src).css({width:op.w,height:op.h});}); 
return false; 
}, 
iFLoad:function(options){ 
var sr= jQuery(this).attr("href"); 
var op = jQuery.extend({src:sr},options); 
qBox.iFrame(op); 
return false; 
} 
});

出处 cn795.cnblogs.com
Javascript 相关文章推荐
jQuery .attr()和.removeAttr()方法操作元素属性示例
Jul 16 Javascript
浅析hasOwnProperty方法的应用
Nov 20 Javascript
js使用数组判断提交数据是否存在相同数据
Nov 27 Javascript
JS判断客户端是手机还是PC的2个代码
Apr 12 Javascript
SeaJS 与 RequireJS 的差异对比
Dec 08 Javascript
javascript图片延迟加载实现方法及思路
Dec 31 Javascript
js实现图片缓慢放大缩小效果
Aug 02 Javascript
浅谈Node.js CVE-2017-14849 漏洞分析(详细步骤)
Nov 10 Javascript
Angular 实现输入框中显示文章标签的实例代码
Nov 07 Javascript
微信小程序中网络请求缓存的解决方法
Dec 29 Javascript
JS正则表达式常见函数与用法小结
Apr 13 Javascript
jQuery实现开关灯效果
Aug 02 jQuery
JQuery AJAX提交中文乱码的解决方案
Jul 02 #Javascript
IE本地存储userdata的一个bug说明
Jul 01 #Javascript
UserData用法总结 lanyu出品
Jul 01 #Javascript
javascript 函数调用的对象和方法
Jul 01 #Javascript
this和执行上下文实现代码
Jul 01 #Javascript
jquery.validate使用攻略 第五步 正则验证
Jul 01 #Javascript
jquery validate使用攻略 第四步
Jul 01 #Javascript
You might like
操作Oracle的php类
2006/10/09 PHP
adodb与adodb_lite之比较
2006/12/31 PHP
PHP 输出缓存详解
2009/06/20 PHP
YII Framework教程之异常处理详解
2016/03/14 PHP
php使用PDO从数据库表中读取数据的实现方法(必看)
2017/06/02 PHP
swoole锁的机制代码实例讲解
2021/03/04 PHP
IE FF OPERA都可用的弹出层实现代码
2009/09/29 Javascript
jquery高效反选具体实现
2013/05/05 Javascript
Angularjs 基础入门
2014/12/26 Javascript
jQuery找出网页上最高元素的方法
2015/03/20 Javascript
跟我学习javascript的闭包
2015/11/16 Javascript
去除html代码里面的script正则方法
2016/05/19 Javascript
Canvas放置反弹效果随机图形(实例)
2017/08/17 Javascript
ES6 javascript中class类的get与set用法实例分析
2017/10/30 Javascript
vue地址栏直接输入路由无效问题的解决
2018/11/15 Javascript
JS字典Dictionary类定义与用法示例
2019/02/01 Javascript
解决vue 退出动画无效的问题
2020/08/09 Javascript
Python读取视频的两种方法(imageio和cv2)
2018/04/15 Python
pandas基于时间序列的固定时间间隔求均值的方法
2019/07/04 Python
Django应用程序入口WSGIHandler源码解析
2019/08/05 Python
opencv 获取rtsp流媒体视频的实现方法
2019/08/23 Python
python 链接sqlserver 写接口实例
2020/03/11 Python
Python pip安装模块提示错误解决方案
2020/05/22 Python
关于Python不换行输出和不换行输出end=““不显示的问题(亲测已解决)
2020/10/27 Python
Delphi笔试题
2016/11/14 面试题
物流仓管员工作职责
2014/01/06 职场文书
幼儿教师师德演讲稿
2014/05/06 职场文书
计算机网络专业求职信
2014/06/05 职场文书
纪念九一八事变演讲稿1000字
2014/09/14 职场文书
2014年社区妇联工作总结
2014/12/02 职场文书
写给父母的感谢信
2015/01/22 职场文书
2015年上半年信访工作总结
2015/03/30 职场文书
2015年体育部工作总结
2015/04/02 职场文书
运动会跳远广播稿
2015/08/19 职场文书
电工实训心得体会
2016/01/14 职场文书
使用Djongo模块在Django中使用MongoDB数据库
2021/06/20 Python