// target 是DOM元素

// properties 是宿主的属性

$.parser.parseOptions(target,properties);

    /**
* parse options, including standard 'data-options' attribute.
*
* calling examples:
* $.parser.parseOptions(target);
* $.parser.parseOptions(target, ['id','title','width',{fit:'boolean',border:'boolean'},{min:'number'}]);
*/
parseOptions: function(target, properties){
var t = $(target);
var options = {}; var s = $.trim(t.attr('data-options'));
if (s){
if (s.substring(0, 1) != '{'){
s = '{' + s + '}';
}
options = (new Function('return ' + s))();
}
$.map(['width','height','left','top','minWidth','maxWidth','minHeight','maxHeight'], function(p){
var pv = $.trim(target.style[p] || '');
if (pv){
if (pv.indexOf('%') == -1){
pv = parseInt(pv) || undefined;
}
options[p] = pv;
}
}); if (properties){
var opts = {};
for(var i=0; i<properties.length; i++){
var pp = properties[i];
if (typeof pp == 'string'){
opts[pp] = t.attr(pp);
} else {
for(var name in pp){
var type = pp[name];
if (type == 'boolean'){
opts[name] = t.attr(name) ? (t.attr(name) == 'true') : undefined;
} else if (type == 'number'){
opts[name] = t.attr(name)=='0' ? 0 : parseFloat(t.attr(name)) || undefined;
}
}
}
}
$.extend(options, opts);
}
return options;
}

用到的方法

jQuery(elements)

将一个或多个DOM元素转化为jQuery对象。

attr(name)

取得第一个匹配元素的属性值。通过这个方法可以方便地从第一个匹配元素中获取一个属性的值。如果元素没有相应属性,则返回 undefined 。

jQuery.trim(str)

去掉字符串起始和结尾的空格。返回值:String

stringvar.substr(start [, length ])

一般截取字符串之前都会去掉前后空格。

jQuery.map(array, callback)

作为参数的转换函数会为每个数组元素调用,而且会给这个转换函数传递一个表示被转换的元素作为参数。转换函数可以返回转换后的值、null(删除数组中的项目)或一个包含值的数组,并扩展至原始数组中。

target.style[p]

获取DOM元素style属性的p样式的值

小结

  • data-options 为 plugin 设置属性
  • style 覆盖 data-options
  • properties 覆盖 style

jquery.parser.js 的 parseOptions 方法的更多相关文章

  1. 购物车增加、减少商品时动画效果:jQuery.Fly.js插件使用方法

    某些电商网站加入购物车和减少购物车商品数量时,有个小动画,以抛物线形式增减,如图:      这里用到了第三方jQuery.Fly.js插件(底层依赖Jquery库,地址:https://github ...

  2. Jquery 模板插件 jquery.tmpl.js 的使用方法(1):基本语法,绑定,each循环,ajax获取json数据

    jquery.tmpl.js 是一个模板js  ,主要有2个方法 (1):$.template()方法,将一段script或者是Html编译为模板,例如 $.template('myTemplate' ...

  3. 图片延迟加载插件jquery.lazyload.js的使用方法

    最新版的jquery.lazyload.js已不再是伪的延迟加载了 一.请按照基本使用方法说明设置 //载入JavaScript 文件 <script src="jquery.js&q ...

  4. 使用jquery.form.js的ajaxsubmit方法提交数据的Bug

    周五同事遇到一个很奇怪的问题,调到下班,虽然问题解决了,但是不知道问题的具体原因,回来翻了翻代码,才发现症结所在,下面就分享出来,供遇到同样问题的同行们参考: 先把问题描述一下,做的功能是使用ajax ...

  5. jQuery.media.js的使用方法

      该插件可以播放多种类型的多媒体文件包括:Flash, Quicktime, Windows Media Player, Real Player, MP3, Silverlight, PDF等,前提 ...

  6. 【Jquery+Express.js】 submit() 方法提交form

    前端页面 .html 生成一个动态模块 Modal <div class="modal fade" id="addStaff" tabindex=&quo ...

  7. Jquery 模板插件 jquery.tmpl.js 的使用方法(2):嵌套each循环,temp调用(使用预编译的模板缓存)

    直接上代码吧 一:主窗口 /*#region SendChooseTargetTemplate 发送候选人主窗口模板*/ var SendChooseTargetTemplate = ''; Send ...

  8. node.js报错throw err; // Rethrow non-MySQL errors e:\serverTest\node_modules\mysql\lib\protocol\Parser.js:79 解决方法

    今天在用node+angular做后台时,需要使用session保存登陆状态的时候,遇到了此问题,问题直译为非mysql问题,我也在后台取到的登陆用户名和密码,确实不是数据库问题.最后发现在使用ses ...

  9. jQuery.cookie.js插件了解及使用方法

    jquery.cookie.js插件实现浏览器的cookie存储,该插件是基于jquery开发,方便cookie使用. jquerycookie.js的下载地址 http://plugins.jque ...

随机推荐

  1. thinkphp的select和find的区别(转)

    做普通PHP项目转thinkphp时,字段自动完整匹配,ajax时前台数据一直取不到,后发现是select和find返回数据集有差异,参考下面方法修改. $this->ajaxReturn($m ...

  2. CentOS6安装vsftpd

    练习:完成vsftpd配置 (1) 禁锢系统用户于家目录 [root@node3 ~]# yum -y install vsftpd [root@node3 ~]# vim /etc/vsftpd/v ...

  3. 让Delphi XE5跟其他版本的Delphi共存

    找到Delphi XE5的安装根目录  ....  \Program Files (x86)\Embarcadero\RAD Studio\12.0\bin下的cglm.ini文件, 打开cglm.i ...

  4. 【转】Jenkins+Ant+Jmeter自动化性能测试平台

    Jmeter是性能测试的工具,java编写.开源,小巧方便,可以图形界面运行也可以在命令行下运行.网上已经有人使用ant来运行,,既然可以使用ant运行,那和hudson.jenkins集成就很方便了 ...

  5. juc线程池原理(六):jdk线程池中的设计模式

    一.jdk中默认线程池中的代理模式 单例类线程池只有一个线程,无边界队列,适合cpu密集的运算.jdk中创建线程池是通过Executors类中提供的静态的方法来创建的,其中的单例类线程池的方法如下: ...

  6. WIN10运行软件,窗口不显示(移动到屏幕外无法复原)的解决办法 Lebal:bug10解决方案

    双显示器切换回单显示器的时候,可能会遇到窗口移动到屏幕外不显示的情况 像这样虽然有缩略图但是点击无反应,并且平铺窗口也不管用,这个时候单击该窗口,Alt+space 执行最小化以及最大化操作即可复原

  7. 第2章 深入分析java I/O的工作机制(下)

    2.6 设计模式解析之适配器模式 2.6.1 适配器模式的结构 把一个类的接口变换成一客户端能接受的另一个接口. Target(目标接口): 要转换的期待的接口. Adaptee(源角色):需要适配的 ...

  8. IDA Pro 权威指南学习笔记(四) - IDA 用户界面的基本规则

    基本规则: IDA 不提供撤销功能 如果由于不小心按下某个键,导致数据库文件发生意外,这时需要将显示窗口恢复到以前的状态 几乎所有的操作都有其对应的菜单项.热键和工具栏按钮 IDA 的工具栏高度可配置 ...

  9. PHP操作Redis(一) PHP连接Redis,含Redis密码验证、指定某一Redis数据库

    台服务器上都快开启200个redis实例了,看着就崩溃了.这么做无非就是想让不同类型的数据属于不同的应用程序而彼此分开. 那么,redis有没有什么方法使不同的应用程序数据彼此分开同时又存储在相同的实 ...

  10. ffmpeg转码flv到avi《转》

    一个视频转码器,则需要对视频进行解码,然后再对视频进行编码,因而相当于解码器和编码器的结合. 下面图列举了一个视频的转码流程. 输入的视频封装格式是flv 视频编码标准是H.264 音频编码标准是AA ...