Home     |     .Net Programming    |     cSharp Home    |     Sql Server Home    |     Javascript / Client Side Development     |     Ajax Programming

Ruby on Rails Development     |     Perl Programming     |     C Programming Language     |     C++ Programming     |     IT Jobs

Python Programming Language     |     Laptop Suggestions?    |     TCL Scripting     |     Fortran Programming     |     Scheme Programming Language


 
 
Cervo Technologies
The Right Source to Outsource

MS Dynamics CRM 3.0

Javascript / Client Side Development

setTimeout


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[i].onmouseover=function() {
   this.className="show";
  }
  lis[i].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 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.

--

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)

On May 19, 4:58 pm, "David" <n@none.net> wrote:

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[i].onmouseover=function() {
                        this.className="show";
                }
                lis[i].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

In comp.lang.javascript message <Xns9935CA4BDFC11eej@194.109.133.242>
, Sat, 19 May 2007 17:53:09, Evertjan. <exjxw.hannivo@interxnl.net>
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 said the following on 5/20/2007 11:37 AM:

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

--
Randy
Chance Favors The Prepared Mind
comp.lang.javascript FAQ - http://jibbering.com/faq/index.html
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

>> In comp.lang.javascript message <Xns9935CA4BDFC11eej@194.109.133.242>
>> , Sat, 19 May 2007 17:53:09, Evertjan. <exjxw.hannivo@interxnl.net>
>> 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

> 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 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." <exjxw.hannivo@interxnl.net> 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

On May 20, 1:58 am, "David" <n@none.net> 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

Add to del.icio.us | Digg this | Stumble it | Powered by Megasolutions Inc