2

TL;DR : 特定のバージョンの JQuery と特定の JQuery プラグインを、競合することなく、それらが使用する JavaScript ライブラリ/プラグインについて何も知らない複数の異なるサイトに jQuery を含めることに関連付けられている特定の JQuery プラグインを含めたいと考えています。可能？どのように？

全体の話:ページに要素を散らばらhttp://myredditplatform.com/reddit.jsせて含めることで、複数のサイトが Reddit スレッドにリンクできる Reddit プラットフォームを構築したいとしましょう。<a href="" data-reddit-thread-id="1234"></a>ユーザーがそのようなリンクをクリックすると、美しいモーダル ウィンドウで reddit が開きます。

スクリプトを使用するすべてのサイトで Reddit プラットフォームのエクスペリエンスを一貫させたいので、すべてのサイトで特定のモーダル プラグインを使用し、特定の方法でリンクのスタイルを設定したいと考えています。

しかし、他のサイトが使用している Javascript ライブラリやプラグインを確認することはできません。そのため、reddit.jsJQuery をロードするときに、ページ上の他のライブラリと競合してはならずreddit.js、プラグインなどをロードするときに、prettyPhoto関連付けられているだけであることを確認する必要があります。私が含めたjQueryライブラリを使用します。

しかし、私は自分のプラットフォームが広く採用されることも望んでいるので、jQuery が必要であるとか、prettyPhoto が読み込まれている必要があるなど、サイトにこれ以上の制限を加えたくありません。この 1 つの JS ファイルを含めてもらいたいだけですreddit.js。これですべてが実行されます。

これを機能させることは可能ですか？あなたならどうしますか？

ありがとう！

4

2 に答える 2

5

以下は、基本的にあなたが望むことをする私のウィジェットローダーの簡素化されたバージョンです。

コードの重要な行はjquery1_8_2 = jQuery.noConflict(true);

詳細はこちら: http://api.jquery.com/jQuery.noConflict/

var myWidgetLoader = function() {

   this.start = function() {
      this.getScript('https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js', function(){

         jquery1_8_2 = jQuery.noConflict(true);  // true = unconflict all jQuery vars, including "jQuery"
         (function(jQuery) {
            var $ = jQuery;
            // do stuff that uses jQuery
         })(jquery1_8_2);

      });
   }

   this.getScript = function(url, success) {
      var script = document.createElement('script');
      script.src = url;
      var head = document.getElementsByTagName('head')[0], done=false;
      script.onload = script.onreadystatechange = function(){
         if ( !done && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete') ) {
            done = true;
            success();
         }
      };
      head.appendChild(script);
   }

}

myWidgetLoader.start();
于 2012-07-15T12:46:08.083 に答える
4

グローバルを破壊しない jQuery のカスタム ビルドを作成できます。ソースを見てください: https://github.com/jquery/jquery/blob/master/src/exports.js。この行を変更できます：

window.jQuery = window.$ = jQuery;

このようになる：

window.myRedditPluginJquery = jQuery;

次に、コードを実行するときにmyRedditPluginJqueryasを使用する必要があります$。この IIFE のようなもの:

(function($){
    //your code goes here
    //you also probably have to paste the source code for that plugin here too
})(myRedditPluginJquery);
于 2012-07-15T11:30:27.410 に答える