[Javascript] item.onclick = "alert('foo');";

[dnunes at gmail.com (diego nunes)]

On Nov 6, 2005, at 6:01 PM, Anthony Ettinger wrote:
> this doesn't seem to work:
>
> var item = document.getElementById('foo');
> item.onclick = "alert('foo');";

    It's kind of obvious.
    If you think about, you're assigning some value to a property
(which is, in this case, an event). When some action occur, the value
of that specific property will be evaluated, right? If the value is of
the property is "alert('bla');", it will be, indeed, "undefined" (try
to get the response of the function "alert()" --
"alert(alert('test'))"), the way you'll have:
"item.onclick=undefined;"


On 07/11/05, Roger Roelofs <rer@xxxxxxxxxxxxxxx> wrote:
> var item = document.getElementById("foo");
> if ( item ) {
>         item.onclick = function() { alert("foo") };
> }
    To assign a function, passing some parameter, you should use the
way Roger showed, but I have to notice something, here:
  Using "foo.onclick=bar;", and having in the function "bar" a
parameter, it'll receive an object, usally called "e" (which is like
the "event" object, in IE). Test it:

document.getElementById("foo").onclick=bar;
function bar(e) { alert(e.target.id); }

    Into a good browser, the value into the alert will be "foo" (the
ID of the source element). IE don't work in this way, and you need to
get "event.srcElement". You can create a function to return the value
in a X-Browser way, like...
function getSrc(e) { /* event */
  return (e.target) ? e.target :
            (window.event && event.srcElement) ? event.srcElement :
            false;
}

    If you use the way that Roger told, you'll loose the hability to
get the "event object" in the good browsers. To get around it, you
should do...
foo.onclick=function(e) { bar(e, 'parameter'); }
    And use the function in this way:
function bar(e, foo) { alert(foo); } //will alert "parameter"
    Note that you need add a parameter to the function. I wrote a
function, based on the Scott Andrew's one, that do it in a X-Browser
way. Try this:

function adEvento(tO, tE, tF, tPs) { //2.0 - tObject, tEvent, tFunction, tParams
  //Baseada na fun??o original de Scott Andrew - www.scottandrew.com
  var tnF=(tPs) ? function(e) { tF.apply(tO, Array(e).concat(tPs)); } : tF;
  if (tO.addEventListener) { tO.addEventListener(tE, tnF, true); return true; }
  else if (tO.attachEvent) { return tO.attachEvent('on'+tE, tnF); }
  else { /* alert('Erro!'); */ return false; }
}

adEvento(document.getElementById('foo'), 'onclick', bar,
['parameter1', 'parameter2']);
function bar(e, par1, par2) { alert(par1 +' -=- '+ par2 +' -=- '+ e); }

    I hope it helps.

  Amplexos.

--
diego nunes