By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,934 Members | 1,476 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,934 IT Pros & Developers. It's quick & easy.

AddEvent: "Invalid Label" Error in Code that Works for Others

RMWChaos
100+
P: 137
Darnit all, I expect the code I steal from others to work! =D

Below is some code that I got to initiate multiple javascripts on page load (rather than using the "onload=" attribute). According the blog where it was posted, it seems that it works for everyone who posted replies...not a single "this is not working for me" post.

The errors I receive are as follows:

IE7: expected ";" and then "conditional compilation is turned off"

FF & NN: "invalid label"

When I run debug in IE, Firebug, and NN Error Console, all three point the same line of code:

Expand|Select|Wrap|Line Numbers
  1. add : function(node, sEventName, fHandler)
I've done some research around the "invalid label" issue, but all point to the same problem in JSON where an additional set of parenthesis is required, specifically in the syntax:

Expand|Select|Wrap|Line Numbers
  1. ( "(" + someCode + ")" )
But I'll be darned if I can figure out where to include them--I've tried everywhere I can think of. I posted this same question on the blog where I found the supposedly Rock Solid addEvent() code (link included here for reference only, not a plug =D ), but the last post was around August; so no indication that there will be a reply anytime soon or at all.

Any thoughts on what the problem is, or if you believe you have a better code for initiating external javascript files on page load, please let me know!

Here is the code:

Expand|Select|Wrap|Line Numbers
  1. function addEvent(obj, type, fn)
  2.  
  3.     {
  4.  
  5.     if (obj.addEventListener)
  6.  
  7.         {
  8.  
  9.         // standard
  10.  
  11.         obj.addEventListener(type, fn, false);
  12.  
  13.         // bugzilla bug #241518
  14.  
  15.         EventCache.add(obj, type, fn);
  16.  
  17.         }
  18.  
  19.     else if (obj.attachEvent)
  20.  
  21.         {
  22.  
  23.         var func = function()
  24.  
  25.             {
  26.  
  27.             fn.apply(window.event.srcElement);
  28.  
  29.             };
  30.  
  31.         obj.attachEvent("on" + type, func);
  32.  
  33.         EventCache.add(obj, type, func);
  34.  
  35.         }
  36.  
  37.     else if (typeof obj['on'+type] != 'function')
  38.  
  39.         {
  40.  
  41.         obj['on'+type] = fn;
  42.  
  43.         }
  44.  
  45.     else
  46.  
  47.         {
  48.  
  49.         // really old
  50.  
  51.         var oldonload = obj['on'+type];
  52.  
  53.         obj['on'+type] = function()
  54.  
  55.             {
  56.  
  57.             oldonload();
  58.  
  59.             fn();
  60.  
  61.             }
  62.  
  63.         }
  64.  
  65.     }
  66.  
  67.  
  68.  
  69. function removeEvent(obj, type, fn)
  70.  
  71.     {
  72.  
  73.     EventCache.remove(obj, type, fn);
  74.  
  75.     }
  76.  
  77.  
  78.  
  79. var EventCache = function()
  80.  
  81.     {
  82.  
  83.     var listEvents = [];
  84.  
  85.     return
  86.  
  87.         {
  88.  
  89.         listEvents : listEvents,
  90.  
  91.         add : function(node, sEventName, fHandler)
  92.  
  93.             {
  94.  
  95.             listEvents.push(arguments);
  96.  
  97.             },
  98.  
  99.         remove : function(node, sEventName, fHandler)
  100.  
  101.             {
  102.  
  103.             var i, item;
  104.  
  105.             for(i = listEvents.length - 1; i >= 0; i = i - 1)
  106.  
  107.                 {
  108.  
  109.                 if(node == listEvents[i][0] && sEventName == listEvents[i][1] && fHandler == listEvents[i][2])
  110.  
  111.                     {
  112.  
  113.                     item = listEvents[i];
  114.  
  115.                     if(item[0].removeEventListener)
  116.  
  117.                         {
  118.  
  119.                         item[0].removeEventListener(item[1], item[2], item[3]);
  120.  
  121.                         }
  122.  
  123.                     if(item[1].substring(0, 2) != “on”)
  124.  
  125.                         {
  126.  
  127.                         item[1] = “on” + item[1];
  128.  
  129.                         }
  130.  
  131.                     if(item[0].detachEvent)
  132.  
  133.                         {
  134.  
  135.                         item[0].detachEvent(item[1], item[0][sEventName+fHandler]);
  136.  
  137.                         }
  138.  
  139.                     item[0][item[1]] = null;
  140.  
  141.                     }
  142.  
  143.                 }
  144.  
  145.             },
  146.  
  147.         flush : function()
  148.  
  149.             {
  150.  
  151.             var i, item, eventtype;
  152.  
  153.             for(i = listEvents.length - 1; i >= 0; i = i - 1)
  154.  
  155.                 {
  156.  
  157.                 item = listEvents[i];
  158.  
  159.                 if(item[0].removeEventListener)
  160.  
  161.                     {
  162.  
  163.                     item[0].removeEventListener(item[1], item[2], item[3]);
  164.  
  165.                     }
  166.  
  167.                 eventtype = item[1];
  168.  
  169.                 if(item[1].substring(0, 2) != “on”)
  170.  
  171.                     {
  172.  
  173.                     item[1] = ‘on’ + item[1];
  174.  
  175.                     }
  176.  
  177.                 if(item[0].detachEvent)
  178.  
  179.                     {
  180.  
  181.                     item[0].detachEvent(item[1], item[2]);
  182.  
  183.                     item[0].detachEvent(item[1], item[0][eventtype+item[2]]);
  184.  
  185.                     }
  186.  
  187.                 item[0][item[1]] = null;
  188.  
  189.                 }
  190.  
  191.             }
  192.  
  193.         }
  194.  
  195.     }();
  196.  
  197. /* **** End: Global Functions & Vars **** */
  198.  
  199. /* **** Begin: Add Events **** */
  200.  
  201. addEvent(window, "unload", EventCache.flush);
  202.  
Oct 22 '07 #1
Share this Question
Share on Google+
4 Replies


RMWChaos
100+
P: 137
Man, I have spent all day on this bugger, and through sheer brute force, I figured out the problem; something I never would have guessed otherwise.

These lines of code in var EventCache:
Expand|Select|Wrap|Line Numbers
  1. (...)
  2. return
  3.      {
  4. (...)
  5.  
should be written like this:
Expand|Select|Wrap|Line Numbers
  1. (...)
  2. return {
  3. (...)
  4.  
Now did I just miss that somewhere in all my reference materials? Is that standard javascript syntax, or is it specific to JSON?

As for the "conditional compilation is turned off" error in MSIE, that's just a matter of putting /*@cc_on */ and /*@end */ in the right places. Not that I have a clue how that whole mess works. Sigh...more reading to do.

Like I said, it was an ID-10-T error all along. =\
Oct 22 '07 #2

gits
Expert Mod 5K+
P: 5,390
hi ...

i'm not quite sure ... but i think that is a specific problem with the return ... since the parser can parse everything you wrote without syntax-errors. so the parser had no chance to find out that you didn't want to have the object a new statement but wanted it as the return-value. this ist due to the (or only some?) parser behaviour(s) that allow to write statements that don't end with a semicolon ; ... its silly but its how it is ;)

best way to avoid this is to always use the following syntax:

Expand|Select|Wrap|Line Numbers
  1. var obj = {};
  2.  
  3. return obj;
  4.  
looks much clearer doesn't it? i know, of course somebody will not think so ... but it do :)

kind regards
Oct 23 '07 #3

RMWChaos
100+
P: 137
It's gits to my rescue again! =D

So you are saying the best way to approach this is to assign the full code in the current return statement to a var, then return the var. Hm, that makes sense to me, and yes, much clearer. So, the code would look something like this:

Expand|Select|Wrap|Line Numbers
  1. var eventReturn = function() 
  2.         {
  3.  
  4.         listEvents : listEvents,
  5.  
  6.         add : function(node, sEventName, fHandler)
  7.  
  8.        (...)
  9.  
  10.         };
  11.  
  12. var EventCache = function()
  13.  
  14.     {
  15.  
  16.     var listEvents = [];
  17.  
  18.     return eventReturn;
  19.  
  20.     };
  21.  
Oct 25 '07 #4

gits
Expert Mod 5K+
P: 5,390
hi ...

yes ... exactly :) i think you know that using:

Expand|Select|Wrap|Line Numbers
  1. var o = {};
  2.  
literally creates an object instance. and it is equivalent to use

Expand|Select|Wrap|Line Numbers
  1. var o = new Object;
so when using:

Expand|Select|Wrap|Line Numbers
  1. return {};
  2.  
you would first return an anonymous object that you assing to a variable i guess. since objects are passed by reference you could use var o instead and pass the reference of o through the return to a new variable ...

kind regards
Oct 25 '07 #5

Post your reply

Sign in to post your reply or Sign up for a free account.