Re: Dynamically assigning functions with parameters to events



Biguana wrote:
Thank you for taking the time to reply.

You're welcome.

After posting I had actually updated my code so setuplinks just passes
the event and the srcElement to a function passingfunc:

Why both? Event::target (DOM Level 2 Events) and Event::srcElement (MSHTML
DOM) exist.

atags[i].onmouseover=function(event){passingfunc(event,this);};

which in turn does the work at mouseover-time:

function passingfunc(e,caller)
{
e = e || window.event;
var x = caller.id.replace('gp','tip');
eventfunc(e,x);
}

This also takes care of ie managing the events differently and seems
to work fine in ie7, firefox and safari (for windows at least).

It is unnecessarily inefficient: You have to loop through all elements, to
test each element, to create a Function object (therefore allocate memory
for it) for each matching element, and to assign the event listener for the
`mouseover' event for each matching element. Worst Case scenario is that
you have one link in a huge HTML document with many other elements that the
cursor of the pointing device (if there is any) is never moved over, and all
this was for nothing.

It is unreliable: Provided that it even works (using `onmouseover' is a
proprietary approach that is not even partially endorsed by Web standards),
the user may hover over one link before you have been able to set the event
listener for it.

However it obviously still doesn't use your event bubbling model, but
your example seems to assign the event handler in the tag, which I was
informed was wrong? (sorry, I'm a bit of a newb).

You have been misinformed (through Danny Goodman's "JavaScript Bible" by any
chance?). `onmouseover' is an attribute of the `body' element in Valid HTML
4.01 Strict, XHTML 1.0 Strict, and XHTML (Basic) 1.1, and so may appear in
its start tag. [1] It is also the most compatible (incl. IE) and so far the
less maintenance-demanding approach.

I was hoping to just plug my JS into a page that contains the appropriate
classes and let it do all the work?

It does.

I really don't see the point in this.

Apologies for not explaining. It goes through the <a> tags and if it
finds one with the class 'groups-period' and (for example) id 'gp123'
it needs to call eventfunc(e,'tip123') (eventfunc shows a tooltip -
'tip123' is the id of the div for tooltip for the link with id gp123).

Why not simply use CSS directly instead?

If it is declared a *local* variable.

Surely that means declared in the function, as it is?

Yes.

In fact it's declared in the loop (not that it makes any difference
where it's declared, the result is the same).

Yes, because all interoperable ECMAScript implementations so far do not
support block scoping; all variable instantiation takes place before
execution. (JavaScript 1.7 implements block scoping now with the `let'
statement, but it is not an interoperable implementation as it is restricted
to UAs based on Gecko 1.8.1+.)

Using the alternative approach below should
make the problem to disappear already.

But it also means making each <a> tag as follows:

<a href='urlstuff' class='groups-period' id='gp123'
onmouseover='eventfunc(event)' >

It doesn't. I have never wrote about setting the `onmouseover' attribute
for every `a' element. In fact, not having to do that is what event
bubbling is all about.

and I've been informed (perhaps misinformed) that javascript should be
kept out of links.

You have been misinformed, or you have misunderstood. It is appropriate to
use event handler attributes to perform scripting with links (and HTML
elements in general), as long as the DTD or an internal subset defines those
attributes for the particular element (it does in this case[1]). However,
the following is not acceptable in most cases:

<a href="javascript:...">...</a>

See also http://jibbering.com/faq/#FAQ4_24 and http://validator.w3.org/checklink

[1]
http://www.w3.org/TR/html4/struct/global.html#h-7.5.1
http://www.w3.org/TR/html4/sgml/dtd.html#events
http://www.w3.org/TR/xhtml1/dtds.html#dtdentry_xhtml1-strict.dtd_body
http://www.w3.org/TR/xhtml1/dtds.html#dtdentry_xhtml1-strict.dtd_attrs
http://www.w3.org/TR/xhtml1/dtds.html#dtdentry_xhtml1-strict.dtd_events
http://www.w3.org/TR/xhtml-modularization/dtd_module_defs.html#dtdelement_body.qname

Obviously the matter is less urgent as I have a version that works (at
least to my satisfaction for now),

You have a lot to learn, young apprentice. That it works in a handful of
tests in a handful of versions of a handful of Web browsers is *never* a
mark of good quality for client-side script code. You have to able to prove
that it can not break.


PointedEars
--
realism: HTML 4.01 Strict
evangelism: XHTML 1.0 Strict
madness: XHTML 1.1 as application/xhtml+xml
-- Bjoern Hoehrmann
.



Relevant Pages

  • Re: ruby html (or xhtml) forms class...
    ... xx is a library designed to extend ruby objects with html, xhtml, and xml ... xml or xhtml as clean looking and natural as ruby it self. ... attributes may be passed to any tag method as either symbol or string. ...
    (comp.lang.ruby)
  • Re: CSS Safari Problem (Mac)
    ... indirectly quoted, ... anything to say on my point: mixing HTML 4.01 and XHTML 1.0 is clueless. ... The closed meta tag was copied and pasted from Google's Webmaster ... But since this is Usenet, many likely are aware that the theme song ...
    (alt.html)
  • Re: non-backtracking subexpression
    ... (The regex could be split in several lines once this message is ... Here the html element of interest is located. ... opening tag, closing tag, and the text in between the tags. ... This expression matches the opening tag. ...
    (microsoft.public.dotnet.languages.csharp)
  • wierd behavior in program
    ... I am reading a file with html tags in ... I read each tag and push it on the stack and pop it when I ... int degree; ...
    (comp.lang.c)