189 8069 5689

jquery插件编写

1、$.extend() 函数用于将一个或多个对象的内容合并到目标对象。
注意:(1)、 如果只为$.extend()指定了一个参数,则意味着参数targetObj被省略。此时,targetObj就是jQuery对象本身。通过这种方式,我们可以为全局对象jQuery添加新的函数。
(2)、 如果多个对象具有相同的属性,则后者会覆盖前者的属性值。
2、$.extend( targetObj , object1 , object2 ... )
上面是将object1,object2...合并到targetObj中,返回值为合并后的targetObj,由此可以看出该方法合并后,是修改了targetObjt的结构的。如果想要得到合并的结果却又不想修改targetObj的结构,可以如下使用:
var targetObj = $.extend( {}, object1,object2... );//也就是将"{}"作为targetObj参数,然后将合并结果返回给targetObj了

创新互联公司专注为客户提供全方位的互联网综合服务,包含不限于网站建设、成都网站制作、福清网络推广、微信小程序、福清网络营销、福清企业策划、福清品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等,从售前售中售后,我们都将竭诚为您服务,您的肯定,是我们最大的嘉奖;创新互联公司为所有大学生创业者提供福清建站搭建服务,24小时服务热线:18980820575,官方网址:www.cdcxhl.com

3、$.extend( object1 ) //省略targetObj参数,如果省略了targetObj,则该方法就只能有一个obj参数,也就是将object1合并到jquery的全局对象中去

4、$.fn.extend(src); //该方法将src合并到jquery的实例对象中去



    
        
        插件编写
    
    

        

链接一 链接二 链接三

改编成了jquery插件

(function($){

                $.fn.starRating = function(options){

                    var defaults = {
                        num:2
                    }

                    var settings = $.extend({},defaults,options);

                    var starLight = function(items,num){
                        items.each(function(i,elem){
                            if(i<=num){
                                $(this).addClass("on");
                            }else{
                                $(this).removeClass("on")
                            }
                        })
                    };  //这种函数声明是赋值写法,最后需要加分号**;**

                    var init = function(el,num){

                        var starList = $(el),
                        items = starList.find(".star-item");
                        starLight(items,num-1);

                        starList.on("mouseover",".star-item",function(){
                            starLight(items,$(this).index())
                        }).on("click",".star-item",function(){
                            num = $(this).index();
                        }).on("mouseout",function(){
                            starLight(items,num)
                        })
                    };

                    return this.each(function(){
                        num = settings.num;
                        init(this,num);
                    })

                }

            })(jQuery)

            $(".star-list").starRating({
                num:3
            });

分享文章:jquery插件编写
链接URL:http://cdxtjz.cn/article/psjdep.html

其他资讯