1

外部ファイルに Javascript コードがいくつかあります。これは、人々が自分のサイトで使用するためのものです...複数のオプションを渡すことができる方法が必要です...どうすればよいですか?

詳細情報:

html + script + css をロードするように指定します。

    <div class="mywidget"></div>
    <script src="app.js"></script>
    <link rel="stylesheet" type="text/css" href="style.css" />

そしてスクリプト（コードの一部）では：

            var App = {

            init: function(){

                /* ----------------------------
                    On initialization....
                ---------------------------- */

                    App.doStuff(), App.doMoreStuff();

                },
                doStuff: function(){
                  alert('hi');
                }
            }

基本的に、アプリの動作をカスタマイズできるようにしたいので、アラートやその他の量をカスタマイズしてもらいたいとしましょう。

4

4 に答える 4

2

jQuery と同じ方法で行います。オプション オブジェクトのパラメーターを用意し、オプションが渡されない場合はデフォルトに設定します。

var yourFunc = function (options) {
    options = $.extend({
        prop1: 'default1',
        prop2: 'default2'
    }, options || {});

    // do stuff with options
};

jQuery を使用しない場合は$.extend、プロパティをループして未定義の場合は置き換えることで、簡単にスタブできます。

于 2012-09-17T17:21:59.090 に答える
2

標準的な解決策 (たとえば jQuery で使用される) は、関数 (または構成関数) の引数として 1 つの引数のみを受け取り、 map として処理することです。

   func veryFreeFunction(opts) {
      opts = opts || {}; 
      var a = opts.a || "default_a";
      var b = opts.b || "default_b";
      ...
   }

この場合、ユーザーはveryFreeFunction();またはを呼び出すことができますveryFreeFunction({b:"test"});。彼は必要なパラメーターのみを渡します。

于 2012-09-17T17:22:16.113 に答える
0

このタイプの標準は、JSON オブジェクトをライブラリの静的関数またはオブジェクト コンストラクタに渡し、入力パラメータをライブラリのデフォルト パラメータとマージすることだと思います。

例えば：

// Your library
function myLibObj(options){
    var default_options = {
         opt_1: "abc",
         opt_2: "def"
    };

    // Merge options
    $.extend(default_options, options);
}

var newObj = new myLibObj({opt_1: "ghi"});
// Now in this newObj, the options will look like {opt_1: "ghi", opt_2: "def"}
于 2012-09-17T17:23:42.073 に答える
0

1 つの方法は、外部ファイルが script タグ自体にある構成ブロックを探すことです。

   <script type="text/javascript" src="myfile.js">
    var mySettings = {
            instanceName: 'homepage',
            cfg: {
                containerId: 'homepage-slide',
                columnsCount: 6,
                placeholder: true,
            }
    }

    </script>
于 2012-09-17T17:23:43.467 に答える