How to delay the onclick response of an element in javascript

Question

Possible Duplicate:
How to tell browser to stay on current window

Can I delay the onclick action of an element. I have an element which calls a function in the onclick event. How do I delay the call to that function? I want to tell the browser to stop two seconds before performing the onclick action.

The element looks like this.

<div id="id01" class="channel" onclick="load_window('http://www.ewtn.com')"><a>EWTN.com</a></div><br/>EWTN television network</div>

If I put a setTimeout inside the load_window function, the browser treats the window.open as a popup and stops it. So I want to put the question a different way. Is there a way to tell the browser to wait before doing the onclick? In the .click of that element I have code that performs other functions.

    $('.channel').click(function() { 
        $(this).addClass("selected");
        show_layer();
        setInterval("refresh_caption()",300000);
    });

I am looking to delay the call to load_window() while still having that action be treated by the browser as a user action.

score 3 · Answer 1 · answered May 02 '12 at 19:58

The quick and dirty way is to make a new function that wraps a timeout for the load_window call, and set that new function as the onclick value.

function channel_click(){

    // anon wrapper function, 2 second delay
    setTimeout( function () {
        load_window('http://www.ewtn.com');
    } , 2000 );

}

then

<div id="id01" class="channel" onclick="channel_click()"><a>EWTN.com</a></div><br/>EWTN television network</div>

no idea what your load_window function is actually doing, so I can't say what happens after the 2 seconds are up.

Again, this is specific to the example you provided. If you need a more generic approach, you'll have to provide more information.

score 0 · Answer 2 · answered May 02 '12 at 19:57

No, there is no viable way to delay execution of the currently running javascript thread without hanging the browser for that period of time.

You could loop in a tight loop until 2 seconds elapsed and then do your popup thing, but that would be a horrible user experience and some browsers may even abort your script because of its non-responsiveness. I would NOT recommend this at all. It is a bad design.

Executing some code at a later time is normally done via setTimeout(), but you've already said you don't want to use that for popup reasons.

If you care to explain what problem you're really trying to solve, perhaps we can offer some other way to approach the problem.

How to delay the onclick response of an element in javascript

2 Answers2