Events in the createElement function.

Discussion in 'Javascript' started by mouseit101@gmail.com, Jan 15, 2006.

  1. Guest

    Hello, I'm trying to make a navigation bar and need to assign
    mouseover, mouseclick etc. events to a img tag dynamically, here's what
    im using:

    function getP_Element(p_imgsrc,p_id)
    {var tuf = document.createElement("img");
    tuf.src=p_imgsrc;
    tuf.id=p_id;
    tuf.onmouseover="alert('It works!')"
    return(tuf);
    }

    would there need to be some other path like tuf.events.onmouseover?
     
    , Jan 15, 2006
    #1
    1. Advertising

  2. Guest

    or just generally how would you create:

    <img src="[image source]" onmouseover="[javascript]" id="img1" />
     
    , Jan 15, 2006
    #2
    1. Advertising

  3. Matt Kruse Guest

    Matt Kruse, Jan 15, 2006
    #3
  4. wrote:


    > {var tuf = document.createElement("img");
    > tuf.src=p_imgsrc;
    > tuf.id=p_id;
    > tuf.onmouseover="alert('It works!')"


    tuf.onmouseover = function (evt) {
    alert('It works!');
    };
    is one way to do that, probably the best cross browser way when
    scripting HTML document.

    --

    Martin Honnen
    http://JavaScript.FAQTs.com/
     
    Martin Honnen, Jan 15, 2006
    #4
  5. Guest

    oooh ok got it, thank you so much!
     
    , Jan 15, 2006
    #5
  6. Randy Webb Guest

    said the following on 1/15/2006 1:51 PM:
    > Hello, I'm trying to make a navigation bar and need to assign
    > mouseover, mouseclick etc. events to a img tag dynamically, here's what
    > im using:
    >
    > function getP_Element(p_imgsrc,p_id)
    > {var tuf = document.createElement("img");
    > tuf.src=p_imgsrc;
    > tuf.id=p_id;
    > tuf.onmouseover="alert('It works!')"


    tuf.onmouseover = new Function('alert("It works")')

    Or:

    tuf.onmouseover = someFunctionToExecute;

    Note the abscence of the () on the someFunctionToExecute

    --
    Randy
    comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
    Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
     
    Randy Webb, Jan 15, 2006
    #6
  7. Randy Webb Guest

    Martin Honnen said the following on 1/15/2006 2:13 PM:
    >
    >
    > wrote:
    >
    >
    >> {var tuf = document.createElement("img");
    >> tuf.src=p_imgsrc;
    >> tuf.id=p_id;
    >> tuf.onmouseover="alert('It works!')"

    >
    >
    > tuf.onmouseover = function (evt) {
    > alert('It works!');
    > };
    > is one way to do that, probably the best cross browser way when
    > scripting HTML document.


    What are the advantages/disadvantages of using function (evt) over using
    a new Function construct?

    I have seen it done both ways and always wondered the differences and
    advantages of each.

    --
    Randy
    comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
    Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
     
    Randy Webb, Jan 15, 2006
    #7
  8. On 15/01/2006 19:31, Randy Webb wrote:

    [snip]

    > What are the advantages/disadvantages of using function (evt) over using
    > a new Function construct?


    Beyond the (potential) differences in scope chain?

    [snip]

    Mike

    --
    Michael Winter
    Prefix subject with [News] before replying by e-mail.
     
    Michael Winter, Jan 15, 2006
    #8
  9. RobG Guest

    RobG, Jan 16, 2006
    #9
  10. There is a handy library behaviour.js to automate the allocation of
    event functions to multiple elements:

    http://bennolan.com/behaviour/

    Of course, you can just write the for loops yourself, and save your
    users from having to download the library file, but this does look
    tidy.

    Nic
     
    drnicwilliams, Jan 16, 2006
    #10
  11. Randy Webb Guest

    drnicwilliams said the following on 1/16/2006 3:57 AM:
    > There is a handy library behaviour.js to automate the allocation of
    > event functions to multiple elements:
    >
    > http://bennolan.com/behaviour/


    Not sure I would trust a JS file from a site that can't even get the
    errors out of its own site:

    Error: element has no properties
    Source File: http://bennolan.com/behaviour/behaviour.js
    Line: 128

    That is in Firefox.

    In IE, there is a syntax error on the main page:

    Line 129
    Char: 7
    Error: Object required
    Code: 0
    URL: http://bennolan.com/behavior

    --
    Randy
    comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
    Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
     
    Randy Webb, Jan 16, 2006
    #11
  12. Randy Webb wrote:


    > What are the advantages/disadvantages of using function (evt) over using
    > a new Function construct?


    A function expression
    = function (arg) { function body }
    is (in my view) the simpler and more natural way to write an expression
    that evaluates to a function.
    Constructing a function with the Function constructor
    = new Function("arg", "string with function body code")
    is only needed if you need to construct the parameter name and/or
    function body code at runtime from a string. It is much like eval in
    that at run time string with source code needs to be evaluated. If you
    only use eval if really needed (e.g. you need to construct code at
    runtime depending on user input) then you should only use new
    Function("code") the same way.


    --

    Martin Honnen
    http://JavaScript.FAQTs.com/
     
    Martin Honnen, Jan 16, 2006
    #12
  13. On 16/01/2006 00:33, RobG wrote:

    > Michael Winter wrote:
    >
    >> On 15/01/2006 19:31, Randy Webb wrote:
    >>
    >>> What are the advantages/disadvantages of using function (evt) over
    >>> using a new Function construct?

    >>
    >> Beyond the (potential) differences in scope chain?

    >
    > I'll save you some typing :)


    Thank you. That's very good of you. :-D

    > <URL:
    > http://groups.google.co.uk/group/co...d new Function winter&rnum=6#dd7368f8df727b19
    > >


    I thought I'd written about it before...

    Mike

    --
    Michael Winter
    Prefix subject with [News] before replying by e-mail.
     
    Michael Winter, Jan 16, 2006
    #13
  14. Guest

    I know this isnt teribly related but is the lack of () becuase when you
    assign it you're using the source code of that function, the plain
    function name used as a varible holds the source code for the function
    no?
     
    , Jan 16, 2006
    #14
  15. Randy Webb Guest

    said the following on 1/16/2006 6:52 PM:

    Please quote what you are replying to.

    If you want to post a followup via groups.google.com, don't use the
    "Reply" link at the bottom of the article. Click on "show options" at
    the top of the article, then click on the "Reply" at the bottom of the
    article headers.

    > I know this isnt teribly related but is the lack of () becuase when you
    > assign it you're using the source code of that function, the plain
    > function name used as a varible holds the source code for the function
    > no?


    Are you referring to when it is defined you leave off the ()?

    Something like this:

    window.onload = someFunction;

    If so, it assigns a function reference to the onload event. If you add
    the () then it assigns the results of that function to the onload.

    --
    Randy
    comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
    Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/
     
    Randy Webb, Jan 17, 2006
    #15
  16. Guest

    I can't find the button! Also thanks for the info on function refrences.
     
    , Jan 18, 2006
    #16
  17. Randy Webb Guest

    Randy Webb, Jan 18, 2006
    #17
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Arpan

    DOM CreateElement?

    Arpan, Aug 23, 2006, in forum: ASP .Net
    Replies:
    3
    Views:
    500
    Martin Honnen
    Aug 25, 2006
  2. Chris

    Events Events Events Please Help

    Chris, Aug 30, 2005, in forum: ASP .Net Web Controls
    Replies:
    0
    Views:
    425
    Chris
    Aug 30, 2005
  3. Jeremy

    using createElement with VBScript

    Jeremy, Jul 23, 2003, in forum: ASP General
    Replies:
    1
    Views:
    615
    Ray at
    Jul 23, 2003
  4. kie
    Replies:
    25
    Views:
    296
  5. kie
    Replies:
    2
    Views:
    325
    W d'Anjos
    Oct 2, 2003
Loading...

Share This Page