3

ほとんどの人と同じように、私は自分の Web サイトで多数の jquery プラグインを使用しています。Twitter ブートストラップから jquery ui datepicker まで。

しかし、ウェブサイトを多言語化する必要があるため、english.js という一般的な言語ファイルを作成し、そのファイルで、プラグインのデフォルトの一部と他の言語変数を宣言したいと考えています

問題は、これらすべてのプラグインがデフォルトを宣言するためのさまざまな構造を持っていることです。すでにいくつかの質問を見ました ( jquery - プラグインのデフォルトを設定しますか?グローバルに jQuery プラグイン パラメータを定義するjQuery プラグインのデフォルト、...)。しかし、それらは明確ではありません。

構造 1

$.fn.ajaxStatus = function (params)
{
    var settings = $.extend(
            {
                defaultLoadingText :"Loading...",
                defaultSavingText  :"Saving...",
                defaultDoneText    :"Done",
                defaultRedirectText:"Redirecting...",
                defaultErrorText   :"Oops! Our bad, something wrong.";
            },$.fn.ajaxStatus.defaults,
            params),
});

構造 2

   jQuery.fn.extend({
        shrinker:function (options) {
            var opts = $.extend({
                "moreText":"Read more", 
                "lessText":"hide",
            }, $.fn.shrinker.defaults, options);
   });

質問

プラグインを変更せずに、プラグインを使用するたびに使用される機能にデフォルトを割り当てることは可能ですか? 外部ファイルで言語のデフォルトを定義するにはどうすればよいですか?

今、私の言語ファイルにこれがありますが、それは間違っているように感じます。

if ($.fn.ajaxStatus !== undefined) {
    $.fn.ajaxStatus.defaults =
    {
        defaultLoadingText :"Loading2...",
        defaultSavingText  :"Saving2...",
        defaultDoneText    :"Done2",
        defaultRedirectText:"Redirecting2...",
        defaultErrorText   :"Oops! Our bad, something wrong"
    };
}

よろしくお願いします。

4

3 に答える 3

5

次のように、1 つのオブジェクトでそれを行うことがわかりました。

var en = {
    defaultLoadingText: "Loading...",
    defaultSavingText: "Saving...",
    defaultDoneText: "Done",
    defaultRedirectText: "Redirecting...",
    defaultErrorText: "Oops! Our bad, something wrong.";
    moreText: "Read more", 
    lessText: "hide"
};

プラグイン間でオプション名に重複がないと仮定すると、次のようにプラグインを開始できます。

$('').ajaxStatus(en);
$('').shrinker(en);

ほとんどのプラグインは、オプション オブジェクトを受け取り、余分なプロパティを無視します。特定のプラグインに渡したい他のオプションがある場合は、次を使用します$.extend()

$('').ajaxStatus($.extend({}, { success: function () {} }, en));

プラグイン オプションを個別に保持したい場合は、別のレベルを作成してください。

var en = {
    ajaxStatus: {
        defaultLoadingText: "Loading...",
        defaultSavingText: "Saving...",
        defaultDoneText: "Done",
        defaultRedirectText: "Redirecting...",
        defaultErrorText: "Oops! Our bad, something wrong.";
    },
    shrinker: {
        moreText: "Read more", 
        lessText: "hide"
    }
};

それで:

$('').ajaxStatus(en.ajaxStatus);
$('').shrinker(en.shrinker);

最後に、すべての言語を 1 つの多層オブジェクトに格納することで、さまざまな言語を簡単に取得できるようになります。

var localizedOptions = {
    'en-US': {
        ajaxStatus: {
            defaultLoadingText: "Loading...",
            defaultSavingText: "Saving...",
            defaultDoneText: "Done",
            defaultRedirectText: "Redirecting...",
            defaultErrorText: "Oops! Our bad, something wrong.";
        },
        shrinker: {
            moreText: "Read more", 
            lessText: "hide"
        }
    },
    'es-ES': {
        ajaxStatus: {
            defaultLoadingText: "Cargar...",
            defaultSavingText: "Guardar...",
            defaultDoneText: "Terminado",
            defaultRedirectText: "Redirigir...",
            defaultErrorText: "¡Ay! Nuestra algo malo, malo.";
        },
        shrinker: {
            moreText: "Leer más", 
            lessText: "esconder"
        }
    } // ... etc.
};

$('').ajaxStatus(localizedOptions[navigator.language || navigator.userLanguage].ajaxStatus);

私は通常、リソース ファイルの形式で言語ファイルを取得するため、このようなものを自分で使用したことがないことを認めなければなりません。その場合、サーバー側のロジックを介してキーと値のペアの単一のコレクションを出力し、適切なプラグイン プロパティを手動で設定します。

ASP.NET MVC の場合:

<script>
var Resources = {};
@foreach (var kvp in ViewBag.Resources) {
Resources['@kvp.Key'] = "@kvp.Value";
}
</script>

これは、現在のページに応じて、異なるセットを出力します。

于 2012-10-24T18:34:47.890 に答える
3

私はこれに似たようなことをしました。しかし、私は完全な実装を提供していません。

方法は次のとおりです。

次のように、言語のプラグイン パラメータを定義します。

var options = {
    lang: "np" //your default language
};

このように言語オブジェクトを設定します

var lang = {
    "en": {
        "var1" : "This is variable one"
    },
    "np": {
        "var1": "यो एउटा भेरियबल हो ।"  //Different text based on language initials
    }
};

次に、このような値を読み取る関数を簡単に作成できます

function showVar1() {
    alert(lang[options.lang].var1);
}

[デモ]プラグイン ベースではありません。

于 2012-10-18T06:09:17.930 に答える
1

私がそれを行う方法はSTRUCTURE 1に非常に似ていると思います。あなたが提案しているように、プラグインのデフォルトを上書きしても問題ないと思います。

プラグインを次のように構築します。

(function($){

    $.fn.pluginName = function (options) {
        /**
         * Here I'm extending an empty object to include the options
         * passed to the plugin, with the default options.
         */
        var opts = $.extend({}, $.fn.pluginName.defaults, options);

        // body of plugin here
    });

    // default values for plugin
    $.fn.pluginName.defaults = {
        defaultLoadingText :"Loading...",
        defaultSavingText  :"Saving...",
        defaultDoneText    :"Done",
        defaultRedirectText:"Redirecting...",
        defaultErrorText   :"Oops! Our bad, something wrong."
    };

})(jQuery);

次に、オブジェクトenglish.jsを再定義できます。$.fn.plugin.defaults

if ($.fn.pluginName) {
    // override the default values in the specified language
    $.fn.pluginName.defaults = {
        defaultLoadingText :"Loading...",
        defaultSavingText  :"Saving...",
        defaultDoneText    :"Done",
        defaultRedirectText:"Redirecting...",
        defaultErrorText   :"Oops! Our bad, something wrong."
    };
}

これにより、プラグインのデフォルトのデフォルトが上書きされます。それが理にかなっていれば。

于 2012-10-24T20:44:16.623 に答える