jquery.parser.js 的 parseOptions 方法

// 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
时间: 2024-12-16 05:23:12

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

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

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

jquery.media.js的使用方法

该插件可以播放多种类型的多媒体文件包括:Flash, Quicktime, Windows Media Player, Real Player, MP3, Silverlight, PDF等,前提条件是客户端浏览器中装有相应的插件. 该插件主要是将<a>标签转化为<div>,同时生成适合不同类型多媒体文件播放的<Object>对象,起到解析翻译的过程,从而达到多媒体播放的效果.转化过程是在客户端浏览器中实现,所以打开网页到出现播放器之间存在时间差. 首先要引入js文件

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

jquery.cookie.js插件实现浏览器的cookie存储,该插件是基于jquery开发,方便cookie使用. jquerycookie.js的下载地址 http://plugins.jquery.com/project/cookie 1.准备工作 1)由于该插件依赖jQuery,所以首先在页面引入jquey插件 2)在页面引入jQuery.cookie.js 2.使用方法 设置cookie /* ** 设置cookie ** 第一个参数设置cookie的key ** 第二个参数设置co

jQuery.Validate.js在Form标签很多的时候验证速度慢的处理。

最近在项目中有遇到一个Form表单中有200多个标签.在提交表单时网页会出现等待时间很长,甚至会出现网页奔溃的情况. 主要的原因是因为在使用jQuery.Validate.js进行Form验证的时候会花销大量时间.这些时间主要用在两个地方: 1.表单中标签的检查对应jQuery.Validate.js中checkForm()方法. 2.检查完标签后需要显示错误或成功信息对应jQuery.Validate.js中ShowErrors()方法. 先前我们是用的jQuery.Validate.js-1

延迟加载图片插件LazyLoad.js的使用方法

我们常常会见到很多网页的图片并不是一打开页面就全部加载的,而是浏览到当前的图片位置才显示出来.这是怎么实现出来的呢? 其实这就是目前较为流行的“延迟加载”(Lazy Load)技术,灵感来自Matt Mlinac制作的YUI ImageLoader工具箱. 后来就形成了一个比较完整的jQuery插件:jquery.lazyload.js . 下面就介绍一下jquery.lazyload.js的使用方法: Lazy Load 依赖于 jQuery. 请将下列代码加入页面 head 区域: <scr

jquery.cookie.js 配置

一个轻量级的cookie 插件,可以读取.写入.删除 cookie. jquery.cookie.js 的配置 首先包含jQuery的库文件,在后面包含 jquery.cookie.js 的库文件. <script type="text/javascript" src="js/jquery-1.6.2.min.js"></script> <script type="text/javascript" src="

jquery.cookie.js 的配置

一个轻量级的cookie 插件,可以读取.写入.删除 cookie. 首先包含jQuery的库文件,在后面包含 jquery.cookie.js 的库文件. <script type="text/javascript" src="js/jquery-1.6.2.min.js"></script> <script type="text/javascript" src="js/jquery.cookie.js&

jquery.cookie.js 用法

一个轻量级的cookie 插件,可以读取.写入.删除 cookie. jquery.cookie.js 的配置 首先包含jQuery的库文件,在后面包含 jquery.cookie.js 的库文件. <script type="text/javascript" src="js/jquery-1.6.2.min.js"></script> <script type="text/javascript" src="

使用jquery.more.js来实现点击底部更多后, 底部加载出新的数据

<div class="bus-nav-bar ft12"> <div class="navt bor-r-c pos-rel {if $int == 0}fwbold{/if}"><a href="portal.php?mod=merchant&action=voucherlist&int=0">全部订单</a><em class="pos-abs">