2016-05-03 17 views
9

私はこれをどうしようとしているのかというと、問題が発生している可能性があります。jQuery - noConflict()問題

いずれかのスライダが機能します。またはイメージがテキストを置き換えます。両方ではありません。

私はこの "scrollbox.min.js"ファイルをリンクして、スライダーを動作させる必要があります。したがって私はnoConflictを使用しています。

私はscrollbox.min.jsファイルを使用するには、以下のスニペットたい:

<script> 
    jQuery().noConflict(); 
    jQuery(function($) { 
     $(document).ready(function() { 
      jQuery('#scrool').scrollbox({ 
      direction: 'h', 
      switchItems: 3, 
      distance: 540, 
      autoPlay: false 
      }); 
      jQuery('#scrool-backward').click(function() { 
      jQuery('#scrool').trigger('backward'); 
      }); 
      jQuery('#scrool-forward').click(function() { 
      jQuery('#scrool').trigger('forward'); 
      }); 
     }) 
     } 
</script> 

を、私は残りの部分は、サイトのjQueryのを使用します。 。私が気づいた

何か:

私はjQueryの()noConflict置く場所に応じて();コードの異なるセクションを実行することができます。でも、私は仕事に両方が必要:

enter image description here

enter image description here

スクリプトの完全な部分については、以下をご覧ください:

<script src="http://www.qwerty.com/assets/xjs/jquery.scrollbox.min.js"></script> 
<script> 
    jQuery().noConflict(); 
    jQuery(function($) { 
    $(document).ready(function() { 
     jQuery('#scrool').scrollbox({ 
     direction: 'h', 
     switchItems: 3, 
     distance: 540, 
     autoPlay: false 
     }); 
     jQuery('#scrool-backward').click(function() { 
     jQuery('#scrool').trigger('backward'); 
     }); 
     jQuery('#scrool-forward').click(function() { 
     jQuery('#scrool').trigger('forward'); 
     }); 
    }); 
    }); 

</script> 

<script> 
    jQuery(function($) { 
    $(document).ready(function() { 

     jQuery('.starIMGrating').each(function(i, obj) { 

     var myString = jQuery(this).html() 

     if (myString > "5") { 
      var myString = "5" 
     } else {} 

     /* alert(myString); */ 
     myRegexp3 = /\d/; 
     var match = myRegexp3.exec(myString); 

     var myRegexp2 = /\d\.(\d)/; 
     var matchstring = myString; 
     var m; 

     if (myString.indexOf(".") == -1) { 
      var match2 = 0; 
     } else if (myString.indexOf(".") == 1) { 
      var m = myRegexp2.exec(matchstring) 
      var match2 = m[1]; 
     } 

     starIMG = "<img src='http://qwerty/" + match + "_" + match2 + "/5/rating.gif' alt='' style='width:70px !important;' />"; 

     /*alert(match2); */ 
     jQuery(this).html(starIMG); 
     /* alert(starIMG); */ 
     }); 

    }); 
    }); 

</script> 
+1

が、これはこの 'jQuery.noConflictを()してみてください役立ちますかどうかわかりません;'またはnoConflictであなたのjQueryオブジェクトをエイリアシング試してみて、あなたのプラグインの依存関係に応じて、必要に応じて新しいエイリアス名を使用してください。 – kakurala

+0

は私がしようとしてきましたか? –

+1

は、あなたはそれのためにバイオリンを作成してくださいすることができ..しかし、私は右のそれを得るように見えることはできません - –

答えて

8

jQuery().noConflict();を呼び出すと、エラーがスローされます。

Uncaught TypeError: jQuery(...).noConflict is not a function

try { ... }ブロック内にない場合、そのスクリプトの残りの部分はまったく実行されません。あなたはjQuery()からかっこを削除する必要がありますので

noConflictは、メインjQuery名前空間のオブジェクトではなく、個々のjQueryオブジェクトの一部です:

jQuery.noConflict(); 

詳細はこれを参照してください。http://learn.jquery.com/using-jquery-core/dollar-object-vs-function/

+0

これは本当に役に立ちます - ありがとう!しかし、私が気づいたことは、私が使っていたことです:jQuery()。noConflict(); - そして私はそれが今度は他のスクリプトを実行するために許可されている

0

参照してください:jQuery.noConflict()

あなたはそれを取得します:ここでは

jQuery.noConflict(); 
(function($) { 
    $(document).ready(function() { 
    $('#scrool').scrollbox({ 
     direction: 'h', 
     switchItems: 3, 
     distance: 540, 
     autoPlay: false 
    }); 
    $('#scrool-backward').click(function() { 
     $('#scrool').trigger('backward'); 
    }); 
    $('#scrool-forward').click(function() { 
     $('#scrool').trigger('forward'); 
    }); 
    }); 
}(jQuery); 
0

は基本的に、あなたはそんなに簡単に解決策はのインスタンスを1つだけ持っているだろう、(jqueryのライブラリファイルがページに二回追加された)jQueryライブラリの2つのインスタンスを持っていますjqueryライブラリ、それでもしあなたが何らかの形で単一のインスタンスを追加することができれば、それはあなたにとって非常に簡単です。なぜこれが不可能であるのか知りたいのです。

一方、jQueryの余分なインスタンスを削除できない場合は、最新のjqueryインスタンスをページ固有の変数に保存してから、矛盾のない呼び出しを行うことができます。例えば

var $$ = $; 
jQuery.noConflict(); 
$$('#scroll').scrollbox({}) 

あなたが。$$、すなわち$$( '#スクロール')でスクロールボックスを使用することができますスクロールボックス({})と他の人が述べたように、単一の$

4

と他のものは、あなたが使用する必要がありますjQuery.noConflict()ですが、このような何かをデバッグするときは、動く部分をすべて最小限にする必要があります。私が以下に述べることはあなたのために何か問題を引き起こす可能性は低いですが、それはjQueryの非常に目立った誤用を強調しています。あなたは、次のコードを持っている:

jQuery(function ($) { 
    $(document).ready(function(){ 
    ... 
    }); 
}); 

これは、次のことを書くと同等です:

jQuery(document).ready(function ($) { 
    $(document).ready(function(){ 
    ... 
    }); 
}); 

あなたは二枚舌を参照していますか?私に説明してみましょう:

  1. 次の2行が同一である:

    $(function() { /* execute code */ }); 
    $(document).ready(function() { /* execute code */ }); 
    

    だから、あなたがやったように、他の中にあるものの一つ置くとき、あなたは本質的になるまで待って「を言っています文書が準備できたら、文書が再び準備完了するまで待ってからコード ""を実行します。これは冗長で不要です。

  2. あなたは上記の「ドキュメント準備完了」のいずれかのステートメントを使用するたびに

    は、あなたは、コールバック関数内で使用するためのjQueryに別の名前を付けることができます。私たちがしたい場合たとえば、私たちはfOobarにjQueryの名前を変更することができます:noConflict()を使用した場合

    $(function(fOobar) { 
        fOobar('#scroll').trigger('forward'); 
    }); 
    
  3. 上記の手法は、特に便利です。 $ドル記号はそんなに簡単なので誰もjQueryを入力して好きではありません。しかし、noConflict()はドル記号を使用できないことを意味します。これを修正するために、我々は、ページ上の他のコードに影響を与えることなく、バックドル記号にjQueryの名前を変更することができます

    jQuery.noConflict(); 
    jQuery(function ($) { 
        // you can safely use the dollar sign variable inside this function 
        // instead of the cumbersome `jQuery` variable. 
    }); 
    
  4. は最後に、あなたはjQueryのセレクタを渡すたびに、それはその要素を見つけるために多くの仕事を持っていますページのjQueryが疲れすぎないようにするため、jQueryが行った作業を保存(またはキャッシュ)して再利用することができます。ここでは、#scroll要素をキャッシュされた場合、あなたのコードは次のようになります。

    jQuery.noConflict(); 
    jQuery(function ($) { 
        // get the #scroll element once and reuse it 
        var $scroller = $('#scroll'); 
        $scroller.scrollbox({ 
        direction: 'h', 
        switchItems: 3, 
        distance: 540, 
        autoPlay: false 
        }); 
        $('#scrool-backward').click(function() { 
        $scroller.trigger('backward'); 
        }); 
        $('#scrool-forward').click(function() { 
        $scroller.trigger('forward'); 
        }); 
    }); 
    
+0

これは本当に役に立ちます - ありがとう! しかし、私が気づいたことは、私が使用していたされています。 のjQueryを()noConflict();私が使用していたので、それは