jQuery 和 MooTools 冲突
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2810399/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery and MooTools Conflict
提问by flipflopmedia
Okay, so I got jQuery to get along with MooTools with one script, by adding this at the top of the jQuery script:
好的，所以我通过在 jQuery 脚本的顶部添加以下内容，让 jQuery 与 MooTools 一起使用一个脚本：
var $j = jQuery.noConflict();
and then replacing every:
然后替换每个：
$(
with
和
$j(
But how would you get MooTools to like the following script that using jQuery??
但是，您如何让 MooTools 喜欢以下使用 jQuery 的脚本？
Thanks in advance for any input,
提前感谢您的任何意见，
Tracy
特蕾西
//Fade In Content Viewer: By JavaScript Kit: http://www.javascriptkit.com
var fadecontentviewer={
csszindex: 100,
fade:function($allcontents, togglerid, selected, speed){
var selected=parseInt(selected)
var $togglerdiv=$("#"+togglerid)
var $target=$allcontents.eq(selected)
if ($target.length==0){ //if no content exists at this index position (ie: stemming from redundant pagination link)
alert("No content exists at page number "+selected+"!")
return
}
if ($togglerdiv.attr('lastselected')==null || parseInt($togglerdiv.attr('lastselected'))!=selected){
var $toc=$("#"+togglerid+" .toc")
var $selectedlink=$toc.eq(selected)
$("#"+togglerid+" .next").attr('nextpage', (selected<$allcontents.length-1)? selected+1+'pg' : 0+'pg')
$("#"+togglerid+" .prev").attr('previouspage', (selected==0)? $allcontents.length-1+'pg' : selected-1+'pg')
$target.css({zIndex: this.csszindex++, visibility: 'visible'})
$target.hide()
$target.fadeIn(speed)
$toc.removeClass('selected')
$selectedlink.addClass('selected')
$togglerdiv.attr('lastselected', selected+'pg')
}
},
setuptoggler:function($allcontents, togglerid, speed){
var $toc=$("#"+togglerid+" .toc")
$toc.each(function(index){
$(this).attr('pagenumber', index+'pg')
})
var $next=$("#"+togglerid+" .next")
var $prev=$("#"+togglerid+" .prev")
$next.click(function(){
fadecontentviewer.fade($allcontents, togglerid, $(this).attr('nextpage'), speed)
return false
})
$prev.click(function(){
fadecontentviewer.fade($allcontents, togglerid, $(this).attr('previouspage'), speed)
return false
})
$toc.click(function(){
fadecontentviewer.fade($allcontents, togglerid, $(this).attr('pagenumber'), speed)
return false
})
},
init:function(fadeid, contentclass, togglerid, selected, speed){
$(document).ready(function(){
var faderheight=$("#"+fadeid).height()
var $fadecontents=$("#"+fadeid+" ."+contentclass)
$fadecontents.css({top: 0, left: 0, height: faderheight, visibility: 'hidden'})
fadecontentviewer.setuptoggler($fadecontents, togglerid, speed)
setTimeout(function(){fadecontentviewer.fade($fadecontents, togglerid, selected, speed)}, 100)
$(window).bind('unload', function(){ //clean up
$("#"+togglerid+" .toc").unbind('click')
$("#"+togglerid+" .next", "#"+togglerid+" .prev").unbind('click')
})
})
}
}
回答by Vincent Robert
When you have jQuery specific code that is using $, the simplest way is to wrap the code with the following:
当您使用 jQuery 特定代码时，$最简单的方法是使用以下内容包装代码：
// Disable the $ global alias completely
jQuery.noConflict();
// For jQuery scripts
(function($){
// set a local $ variable only available in this block as an alias to jQuery
... here is your jQuery specific code ...
})(jQuery);
// For Mootols scripts
(function($){
// set a local $ variable only available in this block as an alias
// to Mootools document.id
... here is your Mootools specific code ...
})(document.id);
See the second example on noConflict documentation.
请参阅noConflict 文档中的第二个示例。
回答by Raphael Michel
I don't know about a compatibility mode provided by MooTools, but an easy way should be to replace all occurrences of $(in the script by $j(or jQuery(.
我不知道 MooTools 提供的兼容模式，但一个简单的方法应该是$(用$j(或替换脚本中所有出现的jQuery(。
回答by rampatel
Replace $with $jQueryand it should work.
替换$为$jQuery它应该可以工作。
