:: Forum >>

Possible future bug

Hi, I saw you are also using a trick I've been toying with myself recently: your mouseover and mouseout functions.

The idea is very simple yet powerful. But you seem to have made the same mistake I initially had, concerning one little detail.

Suppose you have <div class="button blabla blabla2"> . What if you then use mouseout(this, 'blabla')? (I know it's a bit far-fetched, but it can happen... and when it does it's gonna be hard to find the bug!)

The way I fixed this was adding an extra space _behind_ the classname in the mouseover function. But looking at your code (using RegExp) it might be possible to add an "end-of-word" match to your regexp? (I'm not very familiar with JavaScript regexps.)

Also, I think I remember a cross-browser problem with "my" solution: some browsers seem to remove the extra space. _Maybe_ your solution also suffers from this when the space in mouseover() is automatically removed by the browser (in case an object has only one class).

var mouseout = function(element, name){
try {
element.className = element.className.replace(RegExp(" " + name, "g"), "");
// ignore errors

Hope this helps and prevents some inexplicable bug in the future. (sorry if any of the above is wrong).
Saturday, July 17, 2004
In case anyone is interested, I think the following change fixes the issues I had presented above:

element.className = element.className.replace(RegExp('\\b' + name + '\\b', 'g'), '');

A word-boundary (\b) is matched instead of a space in front (so no problem if this is the only class) and another \b is matched to prevent wrong matches.

I tested this in IE6 and Firefox.

I'm also under the impression that the try-catch is unnecessary, the replace doesn't give any error in case there's no match.

Sunday, August 8, 2004
Yes, I understand what you mean. Using word-boundary in RegExp is really good idea, I will use that. I thought this type of error is unlikely because I use 'active-name-value' combinations for a class name and there can only be one instance of particular 'name'.

As for try-catch I just have a habit of adding this to any event handler, so that end-user will not be annoyed by the error boxes in case something happens that you did not think of (like partial page load..).
Alex (ActiveWidgets)
Sunday, August 8, 2004
Yeah I hadn't really come across a failing situation myself yet, it's a little hypothetical. But it doesn't hurt to fix things now before wasting hours on debugging weird cases. Glad I could be of a little assistance.

Hmmm... just thought of another small issue: maybe it's better to trim the string after the replace. The way it is now, extra spaces keep being added to the className (at least in IE) every time. Ammounts to a small "memory leak"...

Thanks for the try-catch explanation, I was hoping that that would be your reason. For my own project I'll leave them out for now, I hate it when JS doesn't do what I want without errormessage. But I'll probably add something along those lines to the end-user version when I''m done.

Looking forward to your next Active Widget!
Monday, August 9, 2004

This topic is archived.

Back to support forum

Forum search