是否可以在没有冲突的情况下解决与原型.js 和 jquery.js 的冲突？答案

【问题标题】：Is it possible to fix this conflct with prototype.js and jquery.js without no conflict?是否可以在没有冲突的情况下解决与原型.js 和 jquery.js 的冲突？
【发布时间】：2012-02-19 05:27:39
【问题描述】：

对于我在prototype.js 中使用的电话验证...

<body onload="Xaprb.InputMask.setupElementMasks()">

这实际上是一个旧版本 (1.4)，升级到 (1.7) 将不起作用。这是放置在页面中的代码...

<script type="text/javascript" language="javascript">
//<![CDATA[
if ( typeof(Xaprb) == 'undefined' ) {
   Xaprb = new Object();
}

Xaprb.InputMask = {
masks: {
phone: {
         format: '(   )   -    ',
        regex:  /\d/
      }
      },
      setupElementMasks: function() {
      if ( document.getElementsByClassName ) { // Requires the Prototype library
         document.getElementsByClassName('input_mask').each(function(item) {
            Event.observe(item, 'keypress',
               Xaprb.InputMask.applyMask.bindAsEventListener(item), true);
         });
      }
   },
   applyMask: function(event) {
      var match = /mask_(\w+)/.exec(this.className);
      if ( match.length == 2 && Xaprb.InputMask.masks[match[1]] ) {
          var mask = Xaprb.InputMask.masks[match[1]];
     var key  = Xaprb.InputMask.getKey(event);

         if ( Xaprb.InputMask.isPrintable(key) ) {
            var ch      = String.fromCharCode(key);
            var str     = this.value + ch;
            var pos     = str.length;
        if ( mask.regex.test(ch) && pos <= mask.format.length ) {
           if ( mask.format.charAt(pos - 1) != ' ' ) {
              str = this.value + mask.format.charAt(pos - 1) + ch;
           }
           this.value = str;
        }
        Event.stop(event);
     }
  }
  },
   isPrintable: function(key) {
      return ( key >= 32 && key < 127 );
   },
   getKey: function(e) {
      return window.event ? window.event.keyCode
           : e            ? e.which
           :                0;
   }
};
//]]>
</script>

请原谅我，如果遗漏了一些简单的东西，我对这个主题还很陌生。它基本上在客户输入电话号码时验证电话号码。它位于http://www.comparediabetictestingsupplies.com，实际上通过 jreviews 强制滑块不起作用（这是 Joomla！CMS）。我还想补充一下，我在prototype.js中将所有75个'$'都改成了'_'。

【问题讨论】：

编辑js库，如果你是新手，可能容易出错。获取prototype的原始版本并使用jQuery.noConflict()来防止$变量名被jQ占用。 jQ 的所有相同功能都可以通过jQuery 名称而不是$ 使用。
我找到了一种更新到 1.6.1 并使其工作而不使用 getElementsByClassName 的方法。这就是问题所在。一旦我确定它适用于其他表单，我将分享修复程序。

标签： javascript jquery dom prototypejs dom-events

【解决方案1】：

我最终找到了与prototype.js 1.6.1 一起使用的prototype.maskedinput.js。这最终改变了代码，但不仅解决了与 jquery 的冲突，还解决了 mootools。你可以在https://github.com/bjartekv/MaskedInput/blob/master/prototype.maskedinput.js找到源代码

【讨论】：