Javascript跨浏览器脚本

Question

我有一个很小的功能，我只允许数字输入。 它在IE中效果很好，但我无法在FireFox或Chrome中正常工作。 我在我的HTML页面的脚本标签中加载了这个js文件。

var numberOnly = function(evt) { 

  var theEvent = evt || window.event; 
  var key = theEvent.keyCode || theEvent.which; 
  key = String.fromCharCode( key ); 
  var regex = /[0-9]|\./; 
  if( !regex.test(key) ) { 
    theEvent.returnValue = false; 

 } 
}; 

var wireElemToEvent = function(elemId, event, func){

var elem = document.getElementById(elemId);
if (typeof window.event !== 'undefined') {
    elem.attachEvent("on" + event, func);
} else {
    elem.addEventListener(event, func, true);
}
};



var wireEvents = function(){

wireElemToEvent("tbxQuantity", "keypress", numberOnly);
wireElemToEvent("tbxPhone", "keypress", numberOnly);
wireElemToEvent("tbxZip", "keypress", numberOnly);


};

window.onload = wireEvents;

Chrome告诉我

file：/// C：/Documents%20and%20Settings/xxx/Desktop/numbersonly/res/js/numbersonly.js：17未被捕获的TypeError：对象＃<一个HTMLInputElement>没有方法'attachEvent'

知道我在做什么错吗？

Answer 1

在wireElemToEvent您可能需要在初始化elem后检查它是否不为null。 同样，最好检查elem.attachEvent和elem.addEventListener的存在，而不是检查是否定义了window.event 。

Answer 2

这是我用来跨浏览器附加事件的函数：

 function eventListen( t, fn, o ) {
  o = o || window;
  var e = t+fn;
  if ( o.attachEvent ) {
   o['e'+e] = fn;
   o[e] = function(){
    o['e'+e]( window.event );
   };
   o.attachEvent( 'on'+t, o[e] );
  }else{
   o.addEventListener( t, fn, false );
  }
 }

并使用它：

eventListen('message', function(e){
 var msg = JSON.parse(e.data);
    ...
});

Answer 3

我遇到了同样的问题，并且由于我是新手，所以四处寻找解决方案。 显然（typeof window.event！=='undefined'）不会阻止Safari / Chrome进入该if语句。 因此，它实际上初始化了attachEvent，但不知道该如何处理。

解：

var wireElemToEvent = function(elemId, event, func){

var elem = document.getElementById(elemId);
if (elem.attachEvent) {
    elem.attachEvent("on" + event, func);
} 
else { // if (elem.addEventListener) interchangeably
    elem.addEventListener(event, func, true);
}
};

Answer 4

简化跨浏览器脚本编写的一种好方法是使用jQuery 。 另外，没有理由重新发明轮子。 为什么不尝试这个jQuery插件： jQuery»数字