• jquery插件的几种写法


    /**
     * Created by peng on 2016/12/8.
     */
    jQuery.extend({

        min: function(a, b) { return a < b ? a : b; },

        max: function(a, b) { return a > b ? a : b; }

    });

    var settings = { validate: false, limit: 5, name: "foo" };
    var options = { validate: true, name: "bar" };
    jQuery.extend(settings, options,function(){
        //return settings;
    });
    jQuery.extend({
        foo: function() {
            alert('类级别使用extend');
        },
        bar: function(param) {
            alert('类级别使用extend');
        }
    });

    jQuery.foo = {
        ajax:function() {
            alert('类级别使用命名空间');
        },
        bar:function(param) {
            alert('类级别使用命名空间'+param);
        }
    };


    $.fn.extend({
        foo:function(){
            alert('对象级别使用extend');
        },
        bar:function(){
            alert('对象级别使用extend');
        }
    })


    $.fn.foo = {
        fun1:function(){
            alert('对象级别使用命名空间');
        },
        fun2:function(){
            alert('对象级别使用命名空间');
        }
    };



    jQuery.fn.name1 = {
        fun:function() {
            alert('name1的fun');
        },
        bar:function(param) {
            alert('类级别使用命名空间'+param);
        }
    };

    jQuery.fn.extend({
        fun:function() {
            alert('name2的fun');
        },
        bar:function(param) {
            alert('类级别使用命名空间'+param);
        }
    })

    var n={};
    n.f={};
    n.f.a={};
    n.f.a.b={};
    n.f.a.b.foo = function(s){alert("哈哈 多么奇妙"+s);}



    // plugin definition 定义插件

    $.fn.hilight = function(options) { var defaults = { foreground: 'red', background: 'yellow' };

        var opts = $.extend(defaults, options);
        return opts;
    };

    (function ($) {
        //step03-a 插件的默认值属性
        var defaults = {
            prevId: 'prevBtn',
            prevText: 'Previous',
            nextId: 'nextBtn',
            nextText: 'Next'
            //……
        };
        //step02 插件的扩展方法名称
        $.fn.easySlider = function (options) {
            //step03-b 合并用户自定义属性,默认属性
            var options = $.extend(defaults, options);

            return  defaults;
        }
    })(jQuery);

    以下是测试所用页面:

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <script src="js/jquery.js"></script>
        <script src="js/chajian1.js"></script>
    </head>
    <body>
    <div id="content">


    </div>
    <div id="myDiv" style="height:20px;30px;border:1px solid ">



    </div>
    <script type="text/javascript">
        //jQuery.min(2,3); //  2
        //jQuery.max(4,5); //  5
        //console.log(jQuery.min(2,3));
       // console.log(jQuery.max(4,5));
        //$("#content").html(jQuery.min(2,3)+jQuery.max(4,5));
       // console.log(settings);
       //$.foo.bar();
       // jQuery.myPlugin.bar("1");
        //$.foo("ff");
      // n.f.a.b.foo("zhazha ");
        //$("div").fun();

       // $.name1.fun();
       // $.name2.fun();
       // $("#content").name1.fun();
       // $("#content").name2.fun();
        //$('#myDiv').hilight({foreground: 'blue' });
        //console.log($('#myDiv').hilight({foreground: 'blue' }));
       // var obj01 = { name: "英文名:Sam Xiao", age: 29, girlfriend: { name: "Yang", age: 29} }
      //  var obj02 = { name: "中文名:XiaoJian", girlfriend: { name: "YY"} };

       // var a = $.extend(obj01, obj02);
       // var b = $.extend(true, obj01, obj02);
       // var c = $.extend({}, obj01, obj02);
      //  var d = $.extend(true,{}, obj01, obj02);

       // console.log(a);
       // console.log(b);
       // console.log(c);
       // console.log(d);
        console.log($("<div id='notheone'/>").easySlider( {prevId: 'aa',prevText:'bb'}));
    </script>
    </body>
    </html>

  • 相关阅读:
    《面向模式的软件体系结构1模式系统》读书笔记(7) 通信
    《面向模式的软件体系结构2用于并发和网络化对象模式》读书笔记(5) 截取器
    Enum variable is used in switch sentencejava Anny
    How to create a dynamic range source(转) Anny
    Managing Range Names in Excel 2010(转) Anny
    Mixed Content Handling Issue on IE7/8 Anny
    How to resolve "skip non existing resourceDirectory" when using "mvn test" Anny
    Install chinese input method in Ubuntu12.04 Anny
    IDL(International Date Line) Anny
    Web Accessibility508(转) Anny
  • 原文地址:https://www.cnblogs.com/jianxingjianyuan/p/6500856.html
Copyright © 2020-2023  润新知