Javascript cross browser scripting

Question

I have a tiny function I use to only allow numeric input. It works great in IE, but I cannot get it to work in FireFox or Chrome. I have this js file loaded in my script tag of my HTML page.

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 tells me

file:///C:/Documents%20and%20Settings/xxx/Desktop/numbersonly/res/js/numbersonly.js:17Uncaught TypeError: Object #<an HTMLInputElement> has no method 'attachEvent'

Any idea what I am doing wrong?

ntownsend · Accepted Answer · 2010-02-02 19:19:33Z

2

In wireElemToEvent You may want to check that elem is not null after you initialize it. Also, it would be better to check the existence of elem.attachEvent and elem.addEventListener rather than whether window.event is defined.

answered Feb 2, 2010 at 19:19

ntownsend

7,68010 gold badges41 silver badges35 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Mic · Accepted Answer · 2010-02-02 18:24:18Z

1

Here is the function I use to attach events cross browser:

 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 );
  }
 }

And to use it:

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

answered Feb 2, 2010 at 18:24

Mic

25.2k9 gold badges62 silver badges71 bronze badges

Comments

Kevin DiTraglia · Accepted Answer · 2012-11-19 17:45:27Z

1

I've had the same problem and, because I am a novice, was looking around for a day for a solution. Apparently (typeof window.event !== 'undefined') doesn't stop Safari/Chrome from getting in that if statement. So it actually initializes the attachEvent and doesn't know what to do with it.

Solution:

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);
}
};

edited Nov 19, 2012 at 17:45

Kevin DiTraglia

26.2k20 gold badges95 silver badges145 bronze badges

answered Jun 14, 2011 at 3:33

Konstantin Kiritseko

112 bronze badges

Comments

Andy West · Accepted Answer · 2010-02-02 18:15:48Z

0

One good way to make cross-browser scripting easier is to use jQuery. Plus, there's no reason to reinvent the wheel. Why not try this jQuery plugin: jQuery » numeric

answered Feb 2, 2010 at 18:15

Andy West

12.5k4 gold badges37 silver badges52 bronze badges

7 Comments

KP. Over a year ago

+1. Cross browser support will always lead back to jQuery :) Sooo much easier.

Hcabnettek Over a year ago

I agree 100% and I use and love jQuery, however on this particular project, jQuery is not being used. The customer doesn't want any 3rd party libs.

Andy West Over a year ago

Sorry to hear that. Does your customer know that jQuery is supported by Microsoft and will ship as part of Visual Studio 2010? weblogs.asp.net/scottgu/archive/2008/09/28/…

Joel Over a year ago

-1: The answer is not always JQuery. It is extremely easy to attach events in a cross-browser supported way without all the overhead.

Andy West Over a year ago

@Joel: You are right, of course. But using jQuery was merely a suggested alternative. I see no problem promoting the use of, and raising awareness of, a library that I like.

|

Collectives™ on Stack Overflow

Javascript cross browser scripting

4 Answers 4

Comments

Comments

Comments

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related