jquery開發模板

模板

/**
 * @author hp
 *
 * 初始化：
 * $("#xxx").hpSelect({
            data: [{
                id: '1',
                name: '個人實習實踐計劃（項目）',
                selected:true
            }, {
                id: '2',
                name: '所有'
            }],
            autowidth:true,
            width:'200',
            height:'30',
            optionBoxWidth: '200',
            callBack: function() {
              //  alert($("#select").hpSelect("getName"));
            }
        });
 * 方法：
 * 獲取ID$("#xxx").hpSelect("getId")
 * 獲取name$("#xxx").hpSelect("getName")
 *
 * 設置ID$("#xxx").hpSelect("setId",data)
 * 設置多個ID$("#xxx").hpSelect("setIds",arry)
 * 設置Name$("#xxx").hpSelect("setName",name)
 * 設置Name$("#xxx").hpSelect("setData",data);異步設值，下拉內容
 *
 * @date 2017-02-08
 */
(function($) {
    //初始化對象可設置的屬性
    var defaults = {
        data: "",
        autowidth: false,      //是否固定寬度，true 爲自動寬度，false 爲固定寬度
        width: '100',          //固定寬度時，設置select的寬度
        maxWidth: '200',       //自動寬度時候，設置最大select的寬度
        optionBoxWidth: '100', //設置下拉最大寬度
        height: "30",          //設置select高度
        placeholder:"請輸入",  //輸入提示語
        callBack: function() {}//回調函數
    };
    var methods = {
        init: function(options) {
            $(this).hpSelect('setOptions', options);
            return this;
        },
        /**
         * 設置運行參數
         */
        setOptions: function(options) {
            // 嘗試去獲取settings，若是不存在，則返回「undefined」
            var settings = $(this).data('hpSelect');
            // 若是獲取settings失敗，則根據options和default建立它
            if (!settings)
                settings = {};
            settings = $.extend({}, defaults, options);
            // 保存咱們新建立的settings
            $(this).data('hpSelect', settings);
            return this;
        }

    };
    $.fn.hpSelect = function(method) {
        //假如方法存在
        if (methods[method]) {
            return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
            //假如方法不存在，直接調用methods的init方法
        } else if (typeof method === 'object' || !method) {
            return methods.init.apply(this, arguments);
            //不然報錯。方法名不正確
        } else {
            alert('錯誤： ' + method + ' 不是本插件的方法！');
        }
    };

})(jQuery);