加载多个jQuery插件时出现问题

我有一个使用多个（2）jQuery插件的问题。虽然我认为它很简单，但我已经使用了一些搜索引擎，但无法真正找到解决方案。我是新来的jQuery，所以请温柔:)加载多个jQuery插件时出现问题

我会尽量缩短它。我有两个插件：一个drag'n'drop（使用Prototype and Scriptaculous）和一个工具提示插件（TipTip）。这是用来加载文件和库中的代码：

<script type="text/javascript" src="js/jquery-1.3.2.js"></script> 

<script type="text/javascript" src="js/prototype.js"></script> 
<script type="text/javascript" src="http://webdesign.torn.be/tutorials/assets/js/scriptaculous/scriptaculous.js?load=effects,dragdrop"></script> 

<script type="text/javascript" src="js/jquery.tipTip.js"></script> 
<script type="text/javascript" src="js/jquery.tipTip.minified.js"></script>

我打电话使用此功能：

// CALLING THE TIPTIP-PLUGIN 
<script type="text/javascript"> 
    $(function(){ 
    $(".heroStr").tipTip(); 
    }); 
</script> 

// CALLING THE DRAG'N'DROP-PLUGIN 
<script type="text/javascript"> 
    //<![CDATA[ 
    document.observe('dom:loaded', function() { 
     var changeEffect; 
    Sortable.create("selectedSetupTop", {containment: ['listStr', 'listAgi', 'listInt', 'selectedSetupTop', 'selectedSetupMid', 'selectedSetupBot', 'selectedSetupFor'], tag:'img', overlap:'vertical', constraint:false, dropOnEmpty: true, 
     onChange: function(item) { 
      var list = Sortable.options(item).element; 
      $('changeNotification').update(Sortable.serialize(list).escapeHTML()); 
      if(changeEffect) changeEffect.cancel(); 
      changeEffect = new Effect.Highlight('changeNotification', {restoreColor:"transparent" }); 
     },   
     onUpdate: function(list) { 
      new Ajax.Request("saveImageOrder.php", { 
       method: "post", 
       onLoading: function(){$('activityIndicator').show(), $('activityIndicator2').hide()}, 
       onLoaded: function(){$('activityIndicator').hide(), $('activityIndicator2').show()}, 
       parameters: { data: Sortable.serialize(list), container: list.id } 
      });    
     } 
    }); 
    }); 
// ]]> 
</script>

当我在上面使用只有拖放作品的代码。如果我删除TipTip的原型和Scriptaculous文件，但拖放不会工作，当然。

我该如何设法同时运行两者？会提前感谢一些帮助，谢谢！

/cheezen

来源

2011-08-09 Cheezen

[相关问题]（http://stackoverflow.com/q/134572/546661） –

jQuery和其他库在其大部分函数中使用$变量。如果你包含多个（jQuery，Prototype，MooTools等等），他们可能会互相践踏。在使用tipTip时回退到jQuery变量。（你只需要包括一次）

$.noConflict(); //Release the $ variable 
jQuery(function($){ //Shorthand for $(document).ready(), callback locally renames jQuery to $ 
    $(".heroStr").tipTip(); 
});

此外，当您可以同时使用这两种，原型是不是一个jQuery插件，它是一个独立的框架。

来源

2011-08-09 19:00:52 Dennis

非常感谢您的快速解答！以为我试过了，猜我没有。我想如果我想使用另一个插件是一样的？ – Cheezen

document.ready回调获取传递给它的jQuery对象，因此您可以重命名它并使用函数内部的美元符号（请参阅编辑过的帖子）。然而，我会第二个什么bfavaretto说，并使用jQueryUI的实际拖放支持，因为这是一个实际的jQuery插件。 – Dennis

您必须使用jQuery.noConflict()docs来避免在jQuery和Prototype之间发生冲突$。

但是相反，我会建议你使用jQueryUI来处理拖放，而不是原型+ scriptaculous。另外，我建议你更新你的jQuery到最新版本，你使用的是真的过时了。

来源

2011-08-09 19:13:06 bfavaretto

加载多个jQuery插件时出现问题

回答

相关问题