简体   繁体   English

覆盖jQuery插件的设置?

[英]Override settings of jQuery plugin?

I've built a plugin like this : 我已经构建了一个这样的插件:

;(function ($,window,undefined){

  ...
  ...default settings area...
  ...content area...
  ...

})(jQuery,window);

But this plugin can have many(!) configurations .(files configurations) 但是这个插件可以有很多(!)配置。(文件配置)

So each configuration file can be in a js file . 因此每个配置文件都可以在js文件中。 example : 例如:

mySettings.js :

var mySetings= {a:1,b:2.....}

So where is the problem : 那问题出在哪里:

  • the settings file must be loaded before the plugin. 必须在插件之前加载设置文件。 ( so the plugin will be able to read mySettings in the override settings area ) (因此插件将能够在覆盖设置区域中读取mySettings

  • the only way to communicate mySettings with the plugin itself is via the window object 与插件本身通信mySettings的唯一方法是通过window对象

Question : 题 :

What is the correct way to configure a plugin which can have many(!) settings via js file. 配置插件的正确方法是什么,该插件可以通过js文件设置多个(!)设置。

As I don't have a code example to work with I'll give you some generalized solutions. 因为我没有代码示例可以使用,所以我会给你一些通用的解决方案。

  1. Collect the settings object(s) in an array and iterate over them within your override settings area. 收集数组中的设置对象,并在覆盖设置区域内迭代它们。
  2. Expose your plugin via window and directly append the settings there. 通过窗口公开您的插件并直接在那里附加设置。

Example 1 例1

JS JS

//File 1.js
window.settings = window.settings || []; 
window.settings.push({a:'11'}); 

//File2.js
window.settings = window.settings || []; 
window.settings.push({b:'22', c:'33'}); 

//File3.js
window.settings = window.settings || []; 
window.settings.push({b:'222'}); 

//Main.js File
;(function ($,window,undefined){

    var plugin = function(settings){
        var defConfig = {
            a: '1', 
            b: '2',
            c: '3'
        }; 

        var len = settings.length, i; 

        if(len){
            for(i = 0; i < len; i++){
               defConfig = $.extend(defConfig, settings[i]); 
            }
        }else{
            defConfig = $.extend(defConfig, settings); 
        }

        alert(JSON.stringify(defConfig)); 
    }; 

    var instance = new plugin(window.settings || []); 

})(jQuery,window);

Example 2 例2

//Main.js File
;(function ($,window,undefined){

    var plugin = function(){
        var defConfig = {
            a: '1', 
            b: '2',
            c: '3'
        }; 

        this.overrideSettings = function(settings){
            var len = settings.length, i; 

            if(len){
                for(i = 0; i < len; i++){
                   defConfig = $.extend(defConfig, settings[i]); 
                }
            }else{
                defConfig = $.extend(defConfig, settings); 
            }

            alert(JSON.stringify(defConfig)); 
        }
    }; 

    window.instance = new plugin(); 

})(jQuery,window);


//File 1.js
window.instance.overrideSettings({d:'93'}); 

//File2.js
window.instance.overrideSettings({b:'22222'}); 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM