不知道如何使用jQuery noconflict函数

时间:2010-09-30 16:38:28

标签: ajax html5 prototypejs jquery

过去两周我一直在这个网站上工作,到目前为止一切顺利。我有冲突的javascripts,虽然我知道用什么方法来解决问题(jquery noconflict),我不知道如何使用它!

就我而言,我有:

  • 使用原型js和自定义js
  • 的下拉菜单
  • 以及使用一些jquery文件进行验证和错误通知的联系表单

案例很经典,它们可以单独使用,但不能一起使用。我读过一帮网站,大多数都指向使用的解决方案:

<script>

  jQuery.noConflict();

  // Use jQuery via jQuery(...)
  jQuery(document).ready(function(){
    jQuery("div").hide();
  });

  // Use Prototype with $(...), etc.
  $('someid').hide();

</script>

我是javascript的新手,所以我不知道如何使用这个代码段。

这是我的标题:

    <script src="js/prototype.js"></script>
    <script src="js/drop-o-matic.js"></script>
    <script>

  jQuery.noConflict();

  // Use jQuery via jQuery(...)
  jQuery(document).ready(function(){
    jQuery("div").hide();
  });

  // Use Prototype with $(...), etc.
  $('someid').hide();

    </script> 

    <!--[if lt IE 9]>

 <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
 <![endif]-->

    <!-- <script src="http://code.jquery.com/jquery-latest.js"></script>
 <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.min.js"></script>
 <script src="js/jquery.jigowatt.js"></script> -->


    <script>
    document.createElement("article");  
    document.createElement("footer");  
    document.createElement("header");  
    document.createElement("hgroup");  
    document.createElement("nav");
    document.createElement("aside");
    document.createElement("section");
    document.createElement("menu");
    document.createElement("hgroup");
 </script> 

我只有原型&amp; drop-o-matic js生效,表单的js文件被评论(就在IE评论之后)。

原型&amp; drop-o-matic用于html5导航(没有id,只是

        <nav>
            <ul>
                <li><a href="index.php" class="home">Home</a></li>
                ...
                ...
                ...
            </ul>
        </nav>

如何让脚本协同工作?

感谢您的帮助。

2 个答案:

答案 0 :(得分:9)

首先,在包含jQuery库之前,您正在调用jQuery.noConflict()!这肯定是行不通的。在调用noConflict之前必须包含jQuery脚本标记...

<script src="js/prototype.js"></script>
<script src="js/drop-o-matic.js"></script>
<script src="http://code.jquery.com/jquery-latest.js"></script><!-- IMPORTANT -->
<script>
  jQuery.noConflict();
</script>

如果您愿意,也可以为jQuery提供自己的别名......

var $j = jQuery.noConflict();

$j(document).ready(function() {
  $j("div").hide();
});

有关详细信息,请阅读有关Using jQuery with Other Libraries

的API文档

答案 1 :(得分:0)

使用jQuery可以尝试的一件好事是:

$jq = jQuery.noConflict();

然后使用

代替使用$或jQuery代码
$jq("document").ready(function(){

// rest of your jQuery code inside;

});