jQuery插件知识详解(三)

AI权益加码!Claude Code、Cursor等20+工具免费用! 购周边限时加赠Coding Plan Lite,畅享主流AI工具!学习进阶更高效! 阅读详情

视觉相关

lock:开启锁屏

类型:Boolean默认:false说明:中断用户对话框之外的交互,用于显示非常重要的操作/消息,所以不建议频繁使用它,它会让操作变得繁琐

background:锁屏遮罩颜色

类型:String默认:'#FFF'说明:请注意这是一个会影响到全局的配置,后续出现的对话框的遮罩颜色都和此设置一样,再设置不再起作用

opacity:锁屏遮罩透明度

类型:Number默认:.5说明:请注意这是一个会影响到全局的配置,后续出现的对话框的遮罩透明度都和此设置一样,再设置不再起作用

icon:定义消息图标

类型:String默认:null说明:可定义“skins/icons/”目录下的图标名作为参数名(一定要包含后缀名)

padding:内容与边界填充边距(css padding)

类型:String默认:'15px10px'说明:如果内容页为iframe方式加载的则在css里需要设置为0,要不在IE6中易出问题

skin:多皮肤共存时指定的皮肤样式

类型:String默认:''说明:指定窗口要使用的皮肤在加载的多皮肤共存的CSS文件中的相应主类名

交互相关

time:设置对话框显示时间

类型:Number默认:null说明:以秒为单位

resize:是否允许用户调节尺寸

类型:Boolean默认:true

drag:是否允许用户拖动位置

类型:Boolean默认:true

esc:是否允许用户按Esc键关闭对话框

类型:Boolean默认:true说明:只有窗口获得焦点后才能使用此功能

cache:是否缓存iframe方式加载的窗口内容页

类型:Boolean默认:true说明:只有使用iframe方式加载的单独页面的内容时此参数才有效

extendDrag:是否开启增强拖拽体验

类型:Boolean默认:true说明:1.此属性为全局性设置,不能在窗口调用的参数里设置,只能使用lhgdialog.setting.extendDrag来设置
     2.
防止鼠标落入iframe导致不流畅,对超大对话框拖动优化

高级相关

id:设定对话框唯一标识

类型:String|Number默认:null说明:1.防止重复弹出
     2.
定义id后可以使用this.get(youID)lhgdialog.list[youID]获取扩展方法

zIndex:重置全局zIndex初始值

类型:Number默认:1976说明:用来改变对话框叠加高度,请注意这是一个会影响到全局的配置,后续出现的对话框叠加高度将重新按此累加。

init:对话框弹出后执行的函数

类型:Function默认:null说明:如果是以iframe方式加载的内容页此函数会在内容页加载完成后执行

close:对话框关闭前执行的函数

类型:Function默认:null说明:函数如果返回false将阻止对话框关闭。请注意这不是关闭按钮的回调函数,无论何种方式关闭对话框,close都将执行。

parent:打开子窗口的父窗口对象

类型:Object默认:null说明:此参数只用在打开多层窗口都使用遮罩层时才会用到此参数,注意多层窗口锁屏时一定要加此参数

扩展方法

窗口实例对象内部方法

close():关闭对话框

参数:无说明:在需要关闭窗口时可调用此方法

reload(win,url):刷新或跳转指定的页面

参数1:指定的要刷新或跳转的页面的window对象参数2:要跳转到的页面地址

show():显示对话框

参数:无

hide():隐藏对话框

参数:无

title(value):写入标题

参数1:标题的文本说明:无参数则返回创建的窗口对象实例

content(value,add,isFrm):向窗口中写入内容

参数1value -- 窗口中的内容参数2add -- 是否窗口中为后增加的内容参数3isFrm -- 是否使用iframe方式加载窗口说明:如果参数1的前3个字符为'url:'则说明您使用iframe方式加载单独的内容页,这时第三个参数要为true,无参数则返回创建的窗口对象实例

button(arguments):插入一个自定义按钮

参数1name -- 按钮名称参数2callback -- 按下后执行的函数参数3focus -- 是否聚焦点参数4disabled -- 是否标记按钮为不可用状态(后续可使用扩展方法让其恢复可用状态)说明:此参数为多个对象示例:
button({
    name: '
登录',
    focus: true,
    callback: function(){}},{
    name: '
取消'});

position(left,top):重新定位对话框

参数1X轴的坐标参数2Y轴的坐标说明:参数可以为数字或带单位的字符如:'200px'或使用'0%' ~ '100%'作为相对坐标

size(width,height):重新设定对话框大小

参数1:窗口的宽度参数2:窗口的高度说明:参数可以为数字或带单位的字符如:200'200px'

max():最大化窗口

参数:无

min():最小化窗口

参数:无

lock():锁屏

参数:无

unlock():解锁

参数:无

time(val,callback):定时关闭(单位秒)

参数1:数值,以秒为单位参数2:回调函数说明:参数2为窗口关闭前执行的函数

focus() :自动设置窗口中焦点元素

参数:无

zindex() :置顶窗口

参数:无

get(id,object) :根据指定id获取相应的对象

参数1:窗口的id参数2:是否返回的是窗口实例对象说明:参数2的值只有为数字1时才返回指定id的窗口的实例对象

api:内容页中调用窗口实例对象接口

说明:此对象属性是附加在iframe元素的一个属性,在iframe方式加载的内容页中通过调用此函数来获取窗口的实例对象,示例:var api =frameElement.api; 注:此句代码是加在iframe方式加载的内容页中的,一定要注意

opener:加载窗口组件页面的window对象

说明:此属性主要用在iframe方式加载的内容页中,示例:var api = frameElement.api, W = api.opener; 此时的W即为加载窗口组件页面的window对象

iframeiframe方式加载内容的iframe对象

说明:此属性主要用于在窗口组件调用页面操作窗口中的iframe对象

iwiniframe方式加载内容页的window对象

说明:此属性主要用于在窗口组件调用页面操作窗口中的window对象,示例:var dg = $.dialog({'url:content.html',init:function(){ if( this.iwin.document.body) alert('窗口内容页加载完成'); });

窗口外部方法

$.dialog.focus:获取焦点的窗口实例对象

说明:可以使用此属性获取儿得焦点的窗口的对象,示例:var dg = $.dialog.focus;此时的dg就是当前焦点窗口的对象实例

$.dialog.list:所有窗口对象实例的集合

说明:通过此属性可获取所有打开的窗口对象,示例:关闭页面所有对话框var list =$.dialog.list;for( var i in list ){
    list[i].close();}

$.dialog.data(name,value):跨框架数据共享写入接口

参数1:存储的数据名参数2:将要存储的任意数据(无此项则返回被查询的数据,如果此值为false就删除指定名称的数据)说明:框架与框架之间以及与主页面之间进行数据交换是非常头疼的事情,常规情况下你必须知道框架的名称才能进行数据交换,如果是在复杂的多层框架下操作简直就是噩梦。而data方法就是为了解决这个问题,你完全不用管框架层级问题,它可以写入任何类型的数据,而做到各个页面之间数据共享。

扩展的一些提示性的窗口

$.dialog.alert(content,callback,parent):警告消息

参数1:内容参数2:窗口关闭时执行的回调函数参数3:警告窗口的父窗口对象

$.dialog.confirm(content,yes,no,parent):确认

参数1:内容参数2:确定按钮回调函数参数3:取消按钮回调函数参数4:确认窗口的父窗口对象

$.dialog.prompt(content,yes,value,parent):提问

参数1:内容参数2:确定按钮回调函数参数3:文本框默认值参数4:提问窗口的父窗口对象

$.dialog.tips(content,time,icon,callback):短暂提示

参数1:内容参数2:显示时间参数3:提示图标参数4:提示关闭时执行的函数

 

jQuery Accordion插件详解 jQuery Accordion是一个基于jQuery库的插件,它允许用户创建一个或多个可折叠的面板,通常用于显示和隐藏内容。这些面板可以相互独立地展开或折叠,使得用户能够根据需要查看信息,而无需加载新的页面或导航到其他部分。}); 阅读详情

相关推荐

基于jQuery的图片预览插件实战详解

回过头看,Lightbox、Fancybox、Magnific Popup 分别代表了种哲学:极简主义:功能够用,越小越好;功能至上:我能做的,你不许不做;性能优先:快才是王道。没有绝对的好坏,只有是否适合当前场景。作为开发者,我们要做的不是追逐最新最炫的技术,而是在用户体验、开发效率、维护成本之间找到最优解。下次当你面对一个图片预览需求时,不妨先问自己几个问题:用户真的需要视频播放吗?这个项目会不会持续迭代年以上?

weixin_42613018的博客 909

js子页面到父页面传值

function saveData(){   //父页面传过来标签的id属性值    var pid = "${pid}";//父页面传过来标签的id属性值    var pcode = "${pcode}";    // frameElement.api.opener打开父页面//document.getElementById(pcode).value   dom的id选择器.value属性  ...

newobject1788的博客 2525

jquery的mCustomScrollbar滚动条: 无法获取未定义或 null 引用的属性“frameElement

原文地址:这里写链接内容 在ie8下如果一个页面嵌套一个包含mCustomScrollbar滚动条那么如果推动滚动条就会报无法获取未定义或 null 引用的属性“frameElement”的错误 。 搜索一下代码 var o=t.type,a=t.target.ownerDocument!==document[e(frameElement) .offset().top,e(frameEl...

ceoicac的博客 1963

lhgdialog 去父窗口中的方法

var win = frameElement.api.opener; win.reloadTableProdImg(); 只是草稿,先标记下,以后再完善;

sz_bdqn的专栏 5242

lhgdialog 关闭窗口

var api = frameElement.api, W = api.opener; // api.opener 为载加lhgdialog.min.js文件的页面的window对象 api.reload(); api.close();

ggglllzzz的专栏 1940

JEECG弹出表单调用列表刷新

JEECG平台自动生成的录入和编辑表单保存后可以自动更新查询列表,但对于自己定义编写的表单,或者想要提交表单form前中途更新查询列表则需要写代码处理。 具体操作为,在表单文件中需要调用列表刷新的地方使用 frameElement.api.opener.reloadTable(); 在列表文件中添加reloadTable方法(若是自动生成的列表 “***List.jsp”文件,一般会自动生成

GISsunchangfu的专栏 5862

jQuery插件开发

jQuery插件是对jQuery框架利用原型的扩展。插件通常是一个完备功能的封装,它是JQ功能的一个补充或扩展。注意:开发JQ插件,该插件是依赖jQuery的必须先引入jQuery,再引入插件

m0_71873158的博客 2669

jQuery 插件

jQuery 插件

m0_61787196的博客 1425

jQuery插件编写

jQuery插件编写的一些总结

越努力,越幸运! 9140

jQuery插件

目录一、 jQuery插件1. 瀑布流插件jQuery 之家 http://www.htmleaf.com/ 2. 图片懒加载: jQuery 插件库 http://www.jq22.com/ 3. 全屏滚动总结不易~ 本章节对我有很大收获,希望对你也是~~~jQuery 功能比较有限,想要更复杂的特效效果,可以借助于 jQuery 插件完成。注意: 这些插件也是依赖于jQuery来完成的,所以必须要先引入jQuery文件,因此也称为 jQuery 插件jQuery 插件演示:素材自取

2301_80636070的博客 1440

jQuery插件详解

如何创建基本插件 有时您希望在整个代码中提供一些功能。例如,您可能想要一个可以在jQuery选择上调用的方法,该选择对选择执行一系列操作。在这种情况下,您可能想要编写插件jQuery如何工作:jQuery对象方法 在我们编写自己的插件之前,我们必须先了解一下jQuery的工作原理。看看这段代码: $( "a" ).css( "color", "red" ); 这是一些非常基本的j...

开发猫 686

jquery插件扩展详解

为了顺利完成jquery插件的开发,细致阅读了jquery.grid.src.js 源码,感觉则个插件无论在效果显示,还是在使用方法上面,都非常方便。同时,给我们提供了封装jquery插件的良好思维。在此基础上,我借助jquery的另外一个插件jquery.datatables 封装了一个jquery.datatable.combox,来实现了输入框的下拉框选择功能。 在此,简单总结了一下开发j

技术人宝哥 3002

jQuery form插件使用详解

//ajaxForm和ajaxSubmit函数最多接受一个参数,参数为回调函数或提交选项对象 var options={ target:"#output1", //服务器返回内容放在id为output1的元素中 beforeSubmit:showRequest,

3465

jQuery 入门学习教程,从入门到精通,jQuery插件 — 语法知识点与使用方法详解(10)

本文系统介绍了 jQuery 插件的使用与开发,涵盖 Cookie、日历、轮播图等常见插件的语法与实例,并详细讲解了自定义插件的规范写法,包括标签页和弹窗组件的实现。通过具体代码示例和注释,阐明了插件配置、链式调用及封装技巧,最后结合 Cookie、Tab 与 Modal 构建了一个用户设置面板的综合案例,展示了插件在实际项目中的协同应用。

qq_45746668的博客 808

jQuery插件

本文介绍 jQuery 插件相关知识。常用插件如颜色、省市联动、jQueryUI 等可拓展 jQuery 功能,使用时需依次引入 jQuery 文件、插件文件并调用插件方法。开发插件有给 jQuery 原型加实例方法和给 $ 对象加静态方法两种方式,各有特点与应用场景 。

m0_74350516的博客 1287

jQuery插件开发详解

jQuery插件开发详解1、首先使用闭包(把jQuery传入函数,形参是$)2、进入开发(上代码)3、处理传递进来的参数(在init: function () {} 这个属性方法里面)3、完整示例 1、首先使用闭包(把jQuery传入函数,形参是$) 这里使用闭包的好处官方给出了点解释: 1.避免全局依赖 2.避免第方破坏 3.兼容jQuery操作符’$'和jQuery ...

晨埃 342

jquery日历插件daterangepicker全面详解汇总

引入插件库 <script src="https://cdn.jsdelivr.net/jquery/latest/jquery.min.js"></script> <script src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/daterangepicker/daterange

shenwen5225的博客 7527

jQuery插件编写步骤详解

如今做web开发,jquery 几乎是必不可少的,就连vs神器在2010版本开始将Jquery 及ui 内置web项目里了。至于使用jquery好处这里就不再赘述了,用过的都知道。今天我们来讨论下jquery插件机制,jquery有着成千上万的第 插件,有时我们写好了一个独立的功能,也想将其与jquery结合起来,可以用jquery链式调用,这就要扩展jquery,写成插件形式了,如下 面就...

chijiansong的博客 263
上一篇: jQuery插件知识详解(二)
下一篇: jQuery插件实现模拟dialogs效果实例(图片)
mayanling0113
博客等级 码龄15年 18粉丝 73原创
评论 2
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值