Jquery製表符與革命滑塊衝突

我想創建一個包含革命滑塊和製表符腳本的頁面。Jquery製表符與革命滑塊衝突

但不知何故腳本彼此衝突。

革命滑塊的這一部分：

 var tpj=jQuery; 
    tpj.noConflict(); 

    tpj(document).ready(function() { 

    if (tpj.fn.cssOriginal!=undefined) 
     tpj.fn.css = tpj.fn.cssOriginal; 

     tpj('.fullwidthbanner').revolution(
      { 
       delay:9000, 
       startwidth:1024, 
       startheight:616, 
       onHoverStop:"on",      // Stop Banner Timet at Hover on Slide on/off 
       thumbWidth:100,       // Thumb With and Height and Amount (only if navigation Tyope set to thumb !) 
       thumbHeight:50, 
       thumbAmount:3, 
       navigationStyle:"round",    // round,square,navbar,round-old,square-old,navbar-old, or any from the list in the docu (choose between 50+ different item), custom 
       navigationHAlign:"center",    // Vertical Align top,center,bottom 
       navigationVAlign:"top",     // Horizontal Align left,center,right 
       navigationHOffset:0,  
       navigationVOffset:20, 
       soloArrowLeftHalign:"left", 
       soloArrowLeftValign:"center", 
       soloArrowLeftHOffset:20, 
       soloArrowLeftVOffset:0, 
       soloArrowRightHalign:"right", 
       soloArrowRightValign:"center", 
       soloArrowRightHOffset:20, 
       soloArrowRightVOffset:0, 
       touchenabled:"off",      // Enable Swipe Function : on/off 
       stopAtSlide:1,       // Stop Timer if Slide "x" has been Reached. If stopAfterLoops set to 0, then it stops already in the first Loop at slide X which defined. -1 means do not stop at any slide. stopAfterLoops has no sinn in this case. 
       stopAfterLoops:0,      // Stop Timer if All slides has been played "x" times. IT will stop at THe slide which is defined via stopAtSlide:x, if set to -1 slide never stop automatic 
       hideCaptionAtLimit:0,     // It Defines if a caption should be shown under a Screen Resolution (Basod on The Width of Browser) 
       hideAllCaptionAtLilmit:0,    // Hide all The Captions if Width of Browser is less then this value 
       hideSliderAtLimit:0,     // Hide the whole slider, and stop also functions if Width of Browser is less than this value 
       fullWidth:"on", 
       shadow:0        //0 = no Shadow, 1,2,3 = 3 Different Art of Shadows - (No Shadow in Fullwidth Version !) 
      }); 
});

似乎與標籤腳本的這一部分有衝突：

$(document).ready(function(){ 
$('#tabs div').hide(); 
$('#tabs div:first').show(); 
$('#tabs ul li:first').addClass('active'); 
$('#tabs ul li a').click(function(){ 
$('#tabs ul li').removeClass('active'); 
$(this).parent().addClass('active'); 
var currentTab = $(this).attr('href'); 
$('#tabs div').hide(); 
$(currentTab).show(); 
return false; 
}); 
});

這些腳本被組合在一個JS文件，該文件可以在這裏找到：http://lovebomb.nl/dating/tabs.js

我用這個站點作爲標籤腳本的基礎：http://www.snelgeldonlineverdienen.nl/

唯一的區別是jQuery和jQuery UI版本。如果我使用此頁面的jquery版本，則轉動滑塊不再起作用。

我已經嘗試修復約4個小時的標籤。

真的可以使用一些幫助。

感謝提前:)

Luuk

來源

2013-04-17 Luuk

截至tabs.js開始，我們有以下聲明：

var tpj=jQuery; 
tpj.noConflict();

此設置變量TPJ到jQuery的對象，然後將jQuery放入noConflict()：

"Many JavaScript libraries use $ as a function or variable name, just as jQuery does. In jQuery's case, $ is just an alias for jQuery, so all functionality is available without using $. If you need to use another JavaScript library alongside jQuery, return control of $ back to the other library with a call to $.noConflict()."

現在，jQuery沒有衝突模式，您不能再使用$訪問jQuery。所以，當我們運行在tabs.js底部代碼：

$(document).ready(function(){ 
    $('#tabs div').hide(); 
    $('#tabs div:first').show(); 
    $('#tabs ul li:first').addClass('active'); 
    $('#tabs ul li a').click(function(){ 
    $('#tabs ul li').removeClass('active'); 
    $(this).parent().addClass('active'); 
    var currentTab = $(this).attr('href'); 
    $('#tabs div').hide(); 
    $(currentTab).show(); 
     return false; 
    }); 
});

我們得到的錯誤

"Uncaught TypeError: Property '$' of object [object Object] is not a function"

因爲$不再引用jQuery的。要訪問jQuery的，我們必須使用jQuery的或 TPJ

如果我們改變tabs.js改變$要麼jQuery的或TPJ

tpj(document).ready(function(){ 
    tpj('#tabs div').hide(); 
    tpj('#tabs div:first').show(); 
    tpj('#tabs ul li:first').addClass('active'); 
    tpj('#tabs ul li a').click(function(){ 
    tpj('#tabs ul li').removeClass('active'); 
    tpj(this).parent().addClass('active'); 
    var currentTab = tpj(this).attr('href'); 
    tpj('#tabs div').hide(); 
    tpj(currentTab).show(); 
     return false; 
    }); 
});

代碼應該正確執行。

來源

2013-04-17 19:07:55

我真的很高興看到一個答案:)不幸的是，這不是答案。我試過你的代碼，它仍然以同樣的方式顯示它。 @ceetee無論如何感謝你的時間，希望你能幫助我進一步？ – Luuk

Hey Luuk，剛剛更新了最後一個代碼片段。 $（document）.ready開頭的$也需要用tpj或jQuery替換。 –

你真棒！謝謝！有用 – Luuk

使用最新的jQuery庫版本（1.7。1 +），並嘗試修改上面的代碼，將它們結合到init.js中的單個文件中，並將其放在頁面中包含的所有* .js文件的底部。

jQuery(document).ready(function() { 
     if (jQuery.fn.cssOriginal!=undefined) 
     jQuery.fn.css = jQuery.fn.cssOriginal; 
      jQuery('.fullwidthbanner').revolution({ 

      delay:9000, 
      startwidth:1024, 
      startheight:616, 
      onHoverStop:"on",  // Stop Banner Timet at Hover on Slide on/off 
      thumbWidth:100,  // Thumb With and Height and Amount (only if navigation Tyope set to thumb !) 
      thumbHeight:50, 
      thumbAmount:3, 
      navigationStyle:"round", // round,square,navbar,round-old,square-old,navbar-old, or any from the list in the docu (choose between 50+ different item), custom 
      navigationHAlign:"center",    // Vertical Align top,center,bottom 
      navigationVAlign:"top",     // Horizontal Align left,center,right 
      navigationHOffset:0,  
      navigationVOffset:20, 
      soloArrowLeftHalign:"left", 
      soloArrowLeftValign:"center", 
      soloArrowLeftHOffset:20, 
      soloArrowLeftVOffset:0, 
      soloArrowRightHalign:"right", 
      soloArrowRightValign:"center", 
      soloArrowRightHOffset:20, 
      soloArrowRightVOffset:0, 
      touchenabled:"off",      // Enable Swipe Function : on/off 
      stopAtSlide:1,       // Stop Timer if Slide "x" has been Reached. If stopAfterLoops set to 0, then it stops already in the first Loop at slide X which defined. -1 means do not stop at any slide. stopAfterLoops has no sinn in this case. 
      stopAfterLoops:0,      // Stop Timer if All slides has been played "x" times. IT will stop at THe slide which is defined via stopAtSlide:x, if set to -1 slide never stop automatic 
      hideCaptionAtLimit:0,     // It Defines if a caption should be shown under a Screen Resolution (Basod on The Width of Browser) 
      hideAllCaptionAtLilmit:0,    // Hide all The Captions if Width of Browser is less then this value 
      hideSliderAtLimit:0,     // Hide the whole slider, and stop also functions if Width of Browser is less than this value 
      fullWidth:"on", 
      shadow:0        //0 = no Shadow, 1,2,3 = 3 Different Art of Shadows - (No Shadow in Fullwidth Version !) 
     }); 
});  

    jQuery(document).ready(function(){ 
     jQuery('#tabs div').hide(); 
     jQuery('#tabs div:first').show(); 
     jQuery('#tabs ul li:first').addClass('active'); 
     jQuery('#tabs ul li a').click(function(){ 
     jQuery('#tabs ul li').removeClass('active'); 
     jQuery(this).parent().addClass('active'); 
     var currentTab = jQuery(this).attr('href'); 
    jQuery('#tabs div').hide(); 
    jQuery(currentTab).show(); 
    return false; 
    }); 
    });

來源

2013-07-25 16:42:02 Ananda

遇到這個問題的同時獲取一個能夠在Meteor上工作的html/css/js登陸頁面模板。在我的情況下，從解決方案中刪除jquery-1.11.1.min.js和jquery-1.11.1.min.map文件修復了這個問題，因爲我已經將最新版本安裝爲一個包。希望這有助於解決方案搜索者的未來。

來源

2015-02-08 05:20:18

Jquery製表符與革命滑塊衝突

回答

相關問題