setTimeout

Discussion in 'Javascript' started by David, May 19, 2007.

  1. David

    David Guest

    Hi,

    I'm trying to set a delay for an onmouseout function on a simple list menu.
    I don't understand why the code below doesn't work. If on the onmouseout I
    use ( this.className="hide"; ) it hides the sub menu, but if I pass it to
    other functions with a setTimeout, it doesn't. Can anyone tell me what I'm
    missing here?



    var myFunction = function() {
    var d = document.all;
    var lis = document.getElementById("navmenu").getElementsByTagName("LI");
    for (var i=0; i<lis.length; i++) {
    lis.onmouseover=function() {
    this.className="show";
    }
    lis.onmouseout=function() {
    //this.className="hide";
    doTimeout(this);
    }
    }
    }

    function doTimeout(el){
    timeout = setTimeout('hideElement('+el+')',2000);
    }

    function hideElement(el){
    el.className="hide";
    }
    window.onload = myFunction;


    Thanks, David
     
    David, May 19, 2007
    #1
    1. Advertising

  2. David

    Lee Guest

    David said:
    >
    >Hi,
    >
    >I'm trying to set a delay for an onmouseout function on a simple list menu.
    >I don't understand why the code below doesn't work. If on the onmouseout I
    >use ( this.className="hide"; ) it hides the sub menu, but if I pass it to
    >other functions with a setTimeout, it doesn't. Can anyone tell me what I'm
    >missing here?


    >function doTimeout(el){
    > timeout = setTimeout('hideElement('+el+')',2000);
    >}


    In this function, el is a reference to some element object.
    The string concatenation operator works only on strings.
    The Javascript engine fixes this for you by automatically invoking
    el.toString() and concatenating the result into the string for you.

    I don't know, off the top of my head, what that might look like, but
    whatever it is, it's a string, so you can't refer to it later in your
    hideElement() function as if it was still an object reference.


    --
     
    Lee, May 19, 2007
    #2
    1. Advertising

  3. David

    Evertjan. Guest

    David wrote on 19 mei 2007 in comp.lang.javascript:

    > doTimeout(this);
    > }
    > }
    >}
    >
    > function doTimeout(el){
    > timeout = setTimeout('hideElement('+el+')',2000);
    >}
    >


    Object pointers will ber converted to a string as [object],
    methinks.

    This probably will result in:

    timeout = setTimeout('hideElement([object])',2000);

    which would try to execute after two seconds the string
    'hideElement([object])'
    which cannot be parsed by the js engine.



    --
    Evertjan.
    The Netherlands.
    (Please change the x'es to dots in my emailaddress)
     
    Evertjan., May 19, 2007
    #3
  4. David

    Daz Guest

    On May 19, 4:58 pm, "David" <> wrote:
    > Hi,
    >
    > I'm trying to set a delay for an onmouseout function on a simple list menu.
    > I don't understand why the code below doesn't work. If on the onmouseout I
    > use ( this.className="hide"; ) it hides the sub menu, but if I pass it to
    > other functions with a setTimeout, it doesn't. Can anyone tell me what I'm
    > missing here?
    >
    > var myFunction = function() {
    > var d = document.all;
    > var lis = document.getElementById("navmenu").getElementsByTagName("LI");
    > for (var i=0; i<lis.length; i++) {
    > lis.onmouseover=function() {
    > this.className="show";
    > }
    > lis.onmouseout=function() {
    > //this.className="hide";
    > doTimeout(this);
    > }
    > }
    >
    > }
    >
    > function doTimeout(el){
    > timeout = setTimeout('hideElement('+el+')',2000);
    >
    > }
    >
    > function hideElement(el){
    > el.className="hide";}
    >
    > window.onload = myFunction;
    >
    > Thanks, David


    Not entirely sure what's going on. But here is you code, with a little
    less text, using a closure. I think that "this", doesn't exist within
    the scope of the setTimeout, which is why a closure is needed, but
    don't quote me on that. If anyone can offer a better explanation, I'd
    appreciate it. I just kinda hacked it until it worked.


    var myFunction = function() {
    var d = document.all;
    var lis =
    document.getElementById("navmenu").getElementsByTagName("LI");
    for (var i=0; i<lis.length; i++) {
    lis.onmouseover=function() {
    this.className="show";
    }
    lis.onmouseout=function() {
    var self = this;
    setTimeout(
    function(){
    self.className="hide";
    }, 2000
    );
    }
    }
    }
    window.onload = myFunction;

    Please excuse the dodgy indentation. I tried to get it to fit
    correctly in this page.
     
    Daz, May 19, 2007
    #4
  5. David

    David Guest

    > Not entirely sure what's going on. But here is you code, with a little
    > less text, using a closure. I think that "this", doesn't exist within
    > the scope of the setTimeout, which is why a closure is needed, but
    > don't quote me on that. If anyone can offer a better explanation, I'd
    > appreciate it. I just kinda hacked it until it worked.
    >
    >
    > var myFunction = function() {
    > var d = document.all;
    > var lis =
    > document.getElementById("navmenu").getElementsByTagName("LI");
    > for (var i=0; i<lis.length; i++) {
    > lis.onmouseover=function() {
    > this.className="show";
    > }
    > lis.onmouseout=function() {
    > var self = this;
    > setTimeout(
    > function(){
    > self.className="hide";
    > }, 2000
    > );
    > }
    > }
    > }
    > window.onload = myFunction;
    >
    > Please excuse the dodgy indentation. I tried to get it to fit
    > correctly in this page.



    Yes, that does work, sort of. It also initiates the timeout on the other
    elemenets where it shouldn't. I think an id reference needs to be added to
    avoid this although I was trying to avoid using id's. It's a step in the
    right direction though.

    David
     
    David, May 19, 2007
    #5
  6. In comp.lang.javascript message <Xns9935CA4BDFC11eejj99@194.109.133.242>
    , Sat, 19 May 2007 17:53:09, Evertjan. <>
    posted:
    >
    >timeout = setTimeout('hideElement([object])',2000);
    >
    >which would try to execute after two seconds the string
    >'hideElement([object])'
    >which cannot be parsed by the js engine.


    Nothing AFAICS intrinsically wrong with executing that string, except
    for the effect being unlikely to be as hoped for.

    function hideElement(X) { alert(X) }
    object = 4
    hideElement([object])

    alerts 4. It even works, for me, with Object.

    --
    (c) John Stockton, Surrey, UK. ?@merlyn.demon.co.uk Delphi 3? Turnpike 6.05
    <URL:http://www.merlyn.demon.co.uk/> TP/BP/Delphi/&c., FAQqy topics & links;
    <URL:http://www.bancoems.com/CompLangPascalDelphiMisc-MiniFAQ.htm> clpdmFAQ;
    <URL:http://www.borland.com/newsgroups/guide.html> news:borland.* Guidelines
     
    Dr J R Stockton, May 20, 2007
    #6
  7. David

    David Guest

    >> In comp.lang.javascript message <Xns9935CA4BDFC11eejj99@194.109.133.242>
    >> , Sat, 19 May 2007 17:53:09, Evertjan. <>
    >> posted:


    > The difference is that in Evertjan's code [object] refers to an Object in
    > the page itself.



    Placing an eval on it should take care of the string wouldn't it?

    eval("timeout" + this + " = window.setTimeout('hideElement( \"" + this +
    "\" )', " + 2000 + " );");

    David
     
    David, May 21, 2007
    #7
  8. David

    David Guest

    > Placing an eval on it should take care of the string wouldn't it?
    >
    > eval("timeout" + this + " = window.setTimeout('hideElement( \"" + this +
    > "\" )', " + 2000 + " );");



    Apologies, a correction:

    eval("timeout=setTimeout('hideElement( \"" + this + "\" )', " + 2000 +
    " );");


    David
     
    David, May 21, 2007
    #8
  9. David

    Evertjan. Guest

    David wrote on 21 mei 2007 in comp.lang.javascript:

    >> Placing an eval on it should take care of the string wouldn't it?
    >>
    >> eval("timeout" + this + " = window.setTimeout('hideElement( \"" +
    >> this + "\" )', " + 2000 + " );");

    >
    >
    > Apologies, a correction:
    >
    > eval("timeout=setTimeout('hideElement( \"" + this + "\" )', " + 2000 +
    > " );");


    eval() needs a string to evaluate, and you do not give it a string or
    something that evaluates to a string before it is used by eval().

    Did you test it???????????

    eval() is evil.


    --
    Evertjan.
    The Netherlands.
    (Please change the x'es to dots in my emailaddress)
     
    Evertjan., May 21, 2007
    #9
  10. David

    David Guest

    "Evertjan." <> wrote in message
    news:Xns9937CF93F1AF7eejj99@194.109.133.242...


    > eval() needs a string to evaluate, and you do not give it a string or
    > something that evaluates to a string before it is used by eval().
    >
    > Did you test it???????????
    >
    > eval() is evil.


    lol, it doesn't work, I think I'm just throwing darts and need to think this
    through. When I find a good solution I will post it.

    David
     
    David, May 22, 2007
    #10
  11. David

    RobG Guest

    On May 20, 1:58 am, "David" <> wrote:
    > Hi,
    >
    > I'm trying to set a delay for an onmouseout function on a simple list menu.
    > I don't understand why the code below doesn't work. If on the onmouseout I
    > use ( this.className="hide"; ) it hides the sub menu, but if I pass it to
    > other functions with a setTimeout, it doesn't. Can anyone tell me what I'm
    > missing here?


    As others have said, the way you are calling the function using
    setTimeout is incorrect.


    >
    > var myFunction = function() {
    > var d = document.all;


    I don't understand the point of that. If you want to allow for IE 4,
    then do proper feature detection for getElementById with fallback to
    document.all if it's supported.


    [...]
    > function doTimeout(el){
    > timeout = setTimeout('hideElement('+el+')',2000);


    Use:

    function doTimeout(el){
    timeout = setTimeout(function(){hideElement(el)},2000);


    That creates a closure back to the doTimeout's el variable so that it
    is still available when the timeout runs.


    --
    Rob
     
    RobG, May 22, 2007
    #11
    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. Andy Pickering

    Smart navigation and js setTimeout

    Andy Pickering, Oct 24, 2003, in forum: ASP .Net
    Replies:
    1
    Views:
    507
    Andy Pickering
    Oct 27, 2003
  2. j van c

    settimeout

    j van c, Dec 5, 2003, in forum: HTML
    Replies:
    5
    Views:
    502
    Nico Schuyt
    Dec 7, 2003
  3. JR

    setTimeout

    JR, Apr 15, 2004, in forum: HTML
    Replies:
    3
    Views:
    552
    Whitecrest
    Apr 15, 2004
  4. =?Utf-8?B?RQ==?=

    javascript setTimeout does not work

    =?Utf-8?B?RQ==?=, May 2, 2006, in forum: ASP .Net
    Replies:
    4
    Views:
    8,845
    =?UTF-8?B?R8O2cmFuIEFuZGVyc3Nvbg==?=
    May 2, 2006
  5. Colin Brown

    socket settimeout ?

    Colin Brown, Dec 3, 2003, in forum: Python
    Replies:
    0
    Views:
    628
    Colin Brown
    Dec 3, 2003
Loading...

Share This Page