イメージスライダを使用しているときのjQueryエラー？

Question

私は、私たちのウェブサイト上の画像の範囲を単純に薄くする画像スライダー（NivoSlider）を持っています。これは、次のコードでホームページ上で正常に動作しています：index.phpの

<!-- Image Slider --> 
    <link rel="stylesheet" href="_ui/css/slider.css" type="text/css" media="screen" /> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 
    <script src="_ui/js/jquery.nivo.slider.pack.js" type="text/javascript"></script> 

    <script type="text/javascript"> 
    $(window).load(function() { 
    $('.nivoSlider').nivoSlider({ 
    effect:'fade', // Specify sets like: 'fold,fade,sliceDown' 
    slices:15, // For slice animations 
    boxCols: 8, // For box animations 
    boxRows: 4, // For box animations 
    animSpeed:500, // Slide transition speed 
    pauseTime:2000, // How long each slide will show 
    startSlide:0, // Set starting Slide (0 index) 
    directionNav:false, // Next & Prev navigation 
    directionNavHide:false, // Only show on hover 
    controlNav:false, // 1,2,3... navigation 
    controlNavThumbs:false, // Use thumbnails for Control Nav 
    controlNavThumbsFromRel:false, // Use image rel for thumbs 
    controlNavThumbsSearch: '.jpg', // Replace this with... 
    controlNavThumbsReplace: '_thumb.jpg', // ...this in thumb Image src 
    keyboardNav:true, // Use left & right arrows 
    pauseOnHover:false, // Stop animation while hovering 
    manualAdvance:false, // Force manual transitions 
    captionOpacity:0.8, // Universal caption opacity 
    prevText: 'Prev', // Prev directionNav text 
    nextText: 'Next', // Next directionNav text 
    beforeChange: function(){}, // Triggers before a slide transition 
    afterChange: function(){}, // Triggers after a slide transition 
    slideshowEnd: function(){}, // Triggers after all slides have been shown 
    lastSlide: function(){}, // Triggers when last slide is shown 
    afterLoad: function(){} // Triggers when slider has loaded 
    }); 
    }); 
    </script> 

のindex.phpスライダーのDIV

<div class="nivoSlider"> 
    <img src="_media/img/home_first_final.jpg" alt="" /> 
    <img src="_media/img/home_second_final.jpg" alt="" /> 
    <img src="_media/img/home_third_final.jpg" alt="" /> 
</div> 

の

HEADを上記のコードが動作しています罰金とレビューすることができますhere。

私がしようとすると、サブコンテンツページのコードを再利用する場合、私は次のエラーを取得する：

[cycle] terminating; zero elements found by selector 
Uncaught TypeError: Object [object Object] has no method 'nivoSlider' 
    (anonymous function) 
    c.event.handle 
    c.event.add.j.handle.o 

私は、サブコンテンツページ上のコード（たとえば、ページhere）をチェックし、コードは今のindex.phpのHEADの正確な複製であるが、以下のようにDIVは次のとおりです。

<div class="nivoSlider"> 
<img src="_media/img/services_first_final.jpg" alt="" /> 
<img src="_media/img/services_second_final.jpg" alt="" /> 
<img src="_media/img/services_third_final.jpg" alt="" /> 
</div> 

間違って何が起こっているのか任意のアイデア？

Answer 1

あなたはjQueryのをロードしています2番目のページで2回

は、私はこの同じ問題を抱えていたページ

<script type="text/javascript" src="_ui/js/jquery-1.5.min.js"></script> 

Answer 2

エラーは、特定のオブジェクトに「nivoSlider」メソッドがないことを示しています。

あなたのコードを見ると、上でそのメソッドを呼び出すためにしようとしているオブジェクトは、次のとおりです（「nivoSlider」）$

はあなたのサブページをロードするときにnivoSliderクラスを持っているアイテムはdoesnのどちらかということが可能です存在しない - またはあなたが期待していないものですか？それらの2つ以上が存在することを

または（FTW）...ので、それが（代わりに、単一のオブジェクトの）配列を返すだので、使用して実行する必要があり、「各」

Answer 3

の終わり近くに、これを持っています。

jQuery.noConflict(); 

これは$ jQueryのエイリアスを使用するスクリプトを中断します：

チェックは任意の行が含まれていないスクリプトが含まれていることを確認します。