`

jquery和prototype冲突解决

阅读更多

问题背景: 想用 jQuery 做 AJAX 处理, 用基于 Prototype 的 EasyValidation 做表单验证, 但是二者不能共存, 因为都用了同一个方法名: $().

解决:

<script type=”text/javascript”>
      jQuery.noConflict();
</script>  

本人测试通过的方式:

1、将jquery.js放到prototype.js前面(这个是必须的!)。
2、在jquery.js后面将$变量重命名。
方法如下:

<script type="text/javascript"  src="jquery.js"></script>
<script type="text/javascript">
         var jQuery=$;
</script>


<script type="text/javascript" type="text/javascript" src="window.js"></script>
<!--上面这个window.js调用了jquery框架的方法-->
<script type="text/javascript" type="text/javascript" src="prototype.js"></script>  

 

 

 

3、将原来使用的$方法名一律替换为jQuery名,如$("obj")替换为jQuery("obj")。

例如下面的一段代码, 混合了 jQuery和基于Prototype的 EasyValidation:

 

<!--  jquery, 注意加载顺序 -->
<script src="js/jquery-1.2.6.pack.js"></script>
<script type=”text/javascript”>
      var jQuery=$;
</script>

<!-- 表单验证 -->
<script src="easy_validation/lib/prototype.js" type="text/javascript"></script>
<script src="easy_validation/lib/effects.js" type="text/javascript"></script>
<script src="easy_validation/src/validation_cn.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="easy_validation/styles/style_min.css" />

    <div id="contents"></div>
  <script>
  jQuery(document).ready(function(){
    //jQuery("#contents").load("test.jsp");
    jQuery("#contents").load("test.jsp?username=BeanSoft")
  });
  </script>
          <!-- 为form增加required-validate class,标识需要验证form -->
        <form id='helloworld' action="#" class='required-validate'>
<input name="user.name" class="required min-length-6 max-length-20 validate-alphanum" value="beansoft">
     *密码:
      <input name="user.password" type="password" class="required min-length-6 max-length-20" value="123456" >

    *密码(重复):
      <input name="password1" type="password" class="required equals-user.password" value="123456" >

            <input type='submit' value='Submit'/>
            <input type='reset' value='Reset'/>
        </form> 

 

分享到:
评论

相关推荐

    jquery + prototype框架

    **jQuery和Prototype框架详解** jQuery和Prototype是两个非常流行的JavaScript库,它们极大地简化了JavaScript的DOM操作、事件处理和动画效果。在这个资源包中,您将找到关于这两个框架的API帮助文档,这对于学习和...

    找到了一篇jQuery与Prototype并存的冲突的解决方法

    "解决jQuery与Prototype并存的冲突" 在Web开发中,使用JavaScript框架可以帮助我们提高开发效率,但是当我们使用多个JavaScript框架时,可能会出现冲突问题。例如,jQuery和Prototype都是非常流行的JavaScript框架...

    jQuery prototype冲突的2种解决方法(附demo示例下载)

    本文实例分析了jQuery prototype冲突的2种解决方法。分享给大家供大家参考,具体如下: jquery和prototype怎么会冲突,归根到底就是因为他们二个都用到了$,同时用,混淆了。这个问题解决过不下5次,每次解决都要查...

    解决其他js和jquery冲突方法

    解决其他js和jquery冲突方法 JS和jQuery是两个非常常用的JavaScript库,但是当它们一起使用时,可能会出现冲突。解决这种冲突的方法是使用noConflict()方法将变量$的控制权让渡给其他库。 在开发过程中,可能还会...

    ecshop解决jquery冲突js

    然而,在实际应用中,由于各种第三方插件和库的引入,可能会出现JavaScript库之间的冲突,尤其是当JQuery与其他使用$符号作为主要作用域的库(如Prototype或MooTools)同时存在时。标题中的"ecshop解决jquery冲突js...

    解决ecshop中使用jquery冲突问题

    标题"解决ecshop中使用jquery冲突问题"指的是如何在 ECShop 环境下,消除 jQuery 与 Prototype 之间的冲突,以便能够安全地使用 jQuery 的功能,特别是利用 jQuery 的 `$.get()` 和 `$.post()` 方法来替换原本使用 ...

    jquery与js函数冲突的两种解决方法.docx

    在JavaScript的开发环境中,尤其是当使用多个库或框架时,比如jQuery和其他JavaScript库(如Prototype、MooTools等),可能会遇到函数名或选择器符号`$`的冲突问题。这是因为这些库都倾向于使用`$`作为主要的函数或...

    ecshop transport.js和jquery冲突的问题

    在尝试将ECSHOP与使用jQuery的插件或功能集成时,可能会遇到`transport.js`和`jquery`的冲突问题。本文将详细解析这个问题,并提供解决方案。 ### 问题分析 `transport.js`是ECSHOP的一部分,主要负责AJAX请求的...

    Jquery与Prototype混合用法对比

    总结来说,当需要在项目中同时使用jQuery和Prototype时,我们可以选择重命名jQuery的"$"函数,或者使用IIFE(立即执行的函数表达式)来隔离作用域,避免命名冲突。这两种方法都能够有效地解决混合使用这两个库时可能...

    demo47-jQuery冲突问题

    这样,即使在页面中同时存在 jQuery 和 Prototype,我们也能够分别使用 `$j` 和 `$` 来选择不同的库进行操作,从而避免了命名冲突。 #### 更深入的理解 - **`jQuery.noConflict()` 的作用**:当调用 `jQuery....

    jQuery $命名冲突解决方案汇总

    $ 是一个常用的标识符,在很多JavaScript库中都有使用,例如Prototype.js和jQuery。当多个库同时被引入到一个页面中时,可能会因为都使用 $ 符号而发生冲突。为此,jQuery 提供了一个名为 noConflict() 的方法,允许...

    关于jQuery库冲突的完美解决办法

    首先,冲突的主要原因是jQuery和其他库(如Prototype)都使用`$`作为它们的主要选择器函数。当两个库同时存在于页面中时,它们都会试图控制`$`变量,从而产生冲突。为了解决这个问题,jQuery提供了一个名为`...

    Jquery命名冲突解决的五种方案分享

    尤其是在引入jQuery这样的流行库时,由于很多JavaScript库和插件也使用$作为标识符,这很容易导致与其他库的冲突。为了解决这一问题,本文将介绍五种解决jQuery命名冲突的方案。 首先,需要了解$符号在jQuery中只是...

    jQuery 美元符冲突的解决方法

    在JavaScript的世界里,jQuery以其简洁的语法和丰富的功能深受开发者喜爱。然而,当使用jQuery与其他JavaScript库(如 Prototype、MooTools 等)时,可能会...这样可以有效地防止和解决冲突问题,确保项目的正常运行。

    jquery框架及源码

    **三、jQuery与Prototype冲突** 在项目中,如果同时使用jQuery和Prototype库,可能会出现命名冲突问题,因为两者都使用了 `$` 符号作为主要的函数名。为解决这个问题,jQuery提供了一个`noConflict()`方法,可以...

    jQuery多个版本和其他js库冲突的解决方法

    然而,当在同一个项目中使用多个版本的jQuery或者与其他JavaScript库(如Prototype、MooTools等)一起工作时,可能会出现冲突,主要体现在全局作用域内的`$`符号上。这是因为许多库都使用`$`作为它们的主要函数接口...

Global site tag (gtag.js) - Google Analytics