jQuery的衝突賦予錯誤

Question

在具有多種功能，它如一個項目的工作，

• 谷歌翻譯
• 圖像滑塊[galleriffic使用]
• 彈出窗口[暗影使用盒]
• JavaScript的水平菜單欄*

在它和埃羅現在我們正在jQuery的衝突當代碼沒有找到jQuery的文件中出現[R消息如

我知道這樣的消息，但這些文件是存在的。

以下是這是由谷歌翻譯所需要的項目 使用的文件列表

1.<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script> 
    2. <script type="text/javascript" src="//jquery-translate.googlecode.com/files/jquery.translate-1.3.7.min.js"></script> 
    3. <script type="text/javascript" src="/scripts/jQuery/jquery.cookie.js"></script> 
    4. <script type="text/javascript" src="/scripts/jquery.bt.js"></script> 
    5. <script type="text/javascript" src="/scripts/jquery-ui-1.8.21.custom.min.js"></script> 
    6. <script type="text/javascript" src="/fancybox/jquery.fancybox.pack.js"></script> 
    7. <script type="text/javascript" src="/scripts/common.js"></script> 

這一個是滑塊

1. <script type="text/javascript" src="/SliderBox/js/jquery-1.3.2.js"></script> 
    2. <script type="text/javascript" src="/SliderBox/js/jquery.galleriffic.js"></script> 
    3. <script type="text/javascript" src="/SliderBox/js/jquery.opacityrollover.js"></script> 

這是彈出窗口

1. <script type="text/javascript" src="/SliderBox/js/prototype.js"></script> 
    2. <script type="text/javascript" src="/SliderBox/js/effects.js"></script> 
    3. <script type="text/javascript" src="/SliderBox/js/lightwindow.js"></script> 
    4. <script type="text/javascript" src="/SliderBox/shadowbox/shadowbox.js"></script> 

這是hori需要的宗塔爾菜單

1. <script type="text/javascript" src="./jquery-1.9.1.min.js"></script> 
    2. <script src="../scripts/jquery.als-1.1.min.js" type="text/javascript"></script> 
    3. <script src="../scripts/settingsEN.js" type="text/javascript"></script> 

我也優化了所有這些，並只包括一個jQuery的1.9.1.min.js 的jQuery的文件，但仍無法清除衝突 下面是我使用的序列

1. <script type="text/javascript" src="./jquery-1.9.1.min.js"></script> 
    2.<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script> 
    3. <script type="text/javascript" src="//jquery-translate.googlecode.com/files/jquery.translate-1.3.7.min.js"></script> 
    4. <script type="text/javascript" src="/scripts/jQuery/jquery.cookie.js"></script> 
    5. <script type="text/javascript" src="/scripts/jquery.bt.js"></script> 
    6. <script type="text/javascript" src="/scripts/jquery-ui-1.8.21.custom.min.js"></script> 
    7. <script type="text/javascript" src="/fancybox/jquery.fancybox.pack.js"></script> 
    8. <script type="text/javascript" src="/scripts/common.js"></script> 
    9. <script type="text/javascript" src="/SliderBox/js/jquery.galleriffic.js"></script> 
    10. <script type="text/javascript" src="/SliderBox/js/jquery.opacityrollover.js"></script> 
    11.<script type="text/javascript" src="/SliderBox/js/prototype.js"></script> 
    12. <script type="text/javascript" src="/SliderBox/js/effects.js"></script> 
    13. <script type="text/javascript" src="/SliderBox/js/lightwindow.js"></script> 
    14. <script type="text/javascript" src="/SliderBox/shadowbox/shadowbox.js"></script> 
    15.<script src="../scripts/jquery.als-1.1.min.js" type="text/javascript"></script> 
    16. <script src="../scripts/settingsEN.js" type="text/javascript"></script> 

我已經嘗試了所有這些

http://api.jquery.com/jQuery.noConflict/

http://learn.jquery.com/using-jquery-core/avoid-conflicts-other-libraries/?rdfrom=http%3A%2F%2Fdocs.jquery.com%2Fmw%2Findex.php%3Ftitle%3DUsing_jQuery_with_Other_Libraries%26redirect%3Dno

http://www.w3schools.com/jquery/jquery_noconflict.asp

我已經嘗試了所有這些

<script type="text/javascript" src="other_lib.js"></script> 
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript"> 
$.noConflict(); 
// Code that uses other library's $ can follow here. 
</script> 

或

<script type="text/javascript" src="other_lib.js"></script> 
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript"> 
$.noConflict(); 
jQuery(document).ready(function($) { 
// Code that uses jQuery's $ can follow here. 
    }); 
// Code that uses other library's $ can follow here. 
</script> 

或

jQuery.noConflict(); 
(function($) { 
$(function() { 
    // more code using $ as alias to jQuery 
}); 
})(jQuery); 
// other code using $ as an alias to the other library 

，但仍然沒能得到解決方案

當我刪除滑塊的這段代碼，每一件事工作正常，沒有錯誤，但滑塊將不起作用

<!--script for slider---> 

     <script type="text/javascript"> 

    jQuery(document).ready(function($) { 
    // We only want these styles applied when javascript is enabled 
    $('div.navigation').css({'width' : '', 'float' : 'right'}); 
    $('div.content').css('display', 'block'); 

    // Initially set opacity on thumbs and add 
    // additional styling for hover effect on thumbs 
    var onMouseOutOpacity = 0.67; 
    $('#thumbs ul.thumbs li').opacityrollover({ 
     mouseOutOpacity: onMouseOutOpacity, 
     mouseOverOpacity: 1.0, 
     fadeSpeed:   'fast', 
     exemptionSelector: '.selected' 
    }); 

    // Initialize Advanced Galleriffic Gallery 
    var gallery = $('#thumbs').galleriffic({ 
     delay:      2500, 
     numThumbs:     15, 
     preloadAhead:    10, 
     enableTopPager:   true, 
     enableBottomPager:   true, 
     maxPagesToShow:   7, 
     imageContainerSel:   '#slideshow', 
     controlsContainerSel:  '#controls', 
     captionContainerSel:  '#caption', 
     loadingContainerSel:  '#loading', 
     renderSSControls:   true, 
     renderNavControls:   true, 
     random:     true, 
     prevLinkText:    '', 
     nextLinkText:    '', 
     nextPageLinkText:   '', 
     playLinkText:    '', 
     pauseLinkText:    '', 
     prevPageLinkText:   '', 
     enableHistory:    false, 
     autoStart:     false, 
     syncTransitions:   true, 
     defaultTransitionDuration: 900, 
     onSlideChange:    function(prevIndex, nextIndex) { 
     // 'this' refers to the gallery, which is an extension of $('#thumbs') 
     this.find('ul.thumbs').children() 
      .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end() 
      .eq(nextIndex).fadeTo('fast', 1.0); 
     }, 
     onPageTransitionOut:  function(callback) { 
     this.fadeTo('fast', 0.0, callback); 
     }, 
     onPageTransitionIn:  function() { 
     this.fadeTo('fast', 1.0); 
     } 
    }); 
    }); 
</script> 



    <!--script end---> 

誰能幫助？

Answer 1

我去這個流程，並解決了這個錯誤。不需要任何.noConflict（）和!!!

1)<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script> 
2)<script type="text/javascript" src="//jquery-translate.googlecode.com/files/jquery.translate-1.3.7.min.js"></script> 
3)<script type="text/javascript" src="/scripts/jQuery/jquery.cookie.js"></script> 
4)<script type="text/javascript" src="/scripts/jquery.bt.js"></script> 
5)<script type="text/javascript" src="/fancybox/jquery.fancybox.pack.js"></script> 
6)<script type="text/javascript" src="/scripts/common.js"></script> 
7)<script src="/scripts/jQuery/insert_active_flash.js" type="text/javascript"></script> 
8)<script type="text/javascript" src="/SliderBox/js/jquery.galleriffic.js"></script> 
9)<script type="text/javascript" src="/SliderBox/js/jquery.opacityrollover.js"></script> 
10)<script type="text/javascript" src="/SliderBox/shadowbox/shadowbox.js"></script> 
11)<script type="text/javascript" src="/scripts/jquery.als-1.1.min.js"></script> 
12)<script type="text/javascript" src="/scripts/settingsEN.js"></script> 

具有的prototype.js衝突即JavaScript的精縮版。我只是刪除了的prototype.js文件，並安排所有的參考文件中的序列[順序是相當重要的]

現在被刪除錯誤我還是想知道什麼是與prototype.js中的實際問題???

Answer 2

嘗試使用.noConflict() jQuery中

<script src="....../jquery-1.8.3.min.js"></script> 
<script type="text/javascript"> 
var jQuery_1_8_3 = $.noConflict(true); 
</script> 

<script type="text/javascript" src="...../jquery-1.4.2.js"></script> 
<script type="text/javascript"> 
var jQuery_1_4_2= $.noConflict(true); 
</script> 

Answer 3

我讀了你的問題，並在每次你使用插件的網站上搜索。

• Any List Scroller
• Shadowbox.js
• Prototype
• Galleriffic

如果缺少了什麼插件，發佈請。

我有類似的問題，如果你的項目是，當此爲您開放，採取文件的HTML服務器我沒有使用$.noConflict(true);

。

我建議你插入調用外部div在一個文件的HTML。

，並在每個文件的HTML，你可以寫與

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

不能調用文件中的每個文件的HTML外部，因爲這創造一個正常的衝突腳本。

和..

我建議這個網站看看最後的圖書館... Google-libraries-last

和..

I have optimized all these and have included only one jquery file of jquery-1.9.1.min.js but still not able to clear the conflict Here is the sequence used by me 

這是更好的。

及:::

有關錯誤TypeError: $ is not a function取決於有這個功能實現或寫。 可能的錯誤是;或{，}，(，) 這是因爲另一個JavaScript庫已加載，並已覆蓋對象$()快捷的jQuery。 因此，當我們包含除jQuery之外的其他JavaScript庫時，我們正在將jQuery庫暴露給衝突。 許多JavaScript庫使用$作爲函數或變量名稱，就像jQuery一樣。在jQuery的例子中，$是jQuery的別名，所以所有的功能都可以使用，不需要使用$。 一個解決方案，如果我們需要使用另一個JavaScript庫一起jQuery的，我們可以用一個調用返回的$控制權交還給其他庫$.noConflict()像：

<script type="text/javascript" src="mootools.js"></script> 
<script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript"> 
    $.noConflict(); 
    jQuery(document).ready(function($) { 
    // Code that uses jQuery's $ follow here. 
    }); 
    // Code that uses other library's $ follow here. 
</script> 

另一個解決方案是重新分配jQuery對象$()回的jQuery庫，在調用$（）對象的函數內封裝我們的調用。因此，我們要確保我們的代碼是不是有原型，Scriptaculous的混亂等

(function($) { 
// Your jquery code 
}) (jQuery); 

假設：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.1.0/prototype.js" type="text/javascript"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/scriptaculous/1.8.3/scriptaculous.js" type="text/javascript"></script> 

<script type="text/javascript"> 
(function($) { 
    // Assigning $ again to jquery 
    $(document).ready(function() { alert("Now you can use to use '$' in your jquery code"); }); 
}) (jQuery); 

//this will fail 
$(document).ready(function() { alert('This fails because $ has been modified outside jquery'); }); 
</script> 

這種方法是自調用匿名函數的風格，以避免與jQuery的衝突。如果你不使用它，那麼你將不得不鍵入jQuery（）而不是它的對象$()。 例子：

$(document) //won't work 
jquery(document) //will work 

例如在JSFIDDLE.NET

最後

Typeerror for null 

外觀上jquery-documentready-controlid-is-null