Why is setTimeout () with 0ms. affects my function

In my case on hover <div>

so add one element inside<div>

But in some div I want to hide the added element after hovering the element.

This is my code and it works!

HTML:

<div class="one">
    <span class="content"></span>
</div>


<div class="two">
    <span class="content"></span>
</div>

      

jQuery:

$("div.one > .content").on("hover" , function(){
    var this_ = $(this);
    this_.prev(".top").remove();
});


$("div.two > .content").on("hover" ,function(){
    var this_ = $(this);
    setTimeout(function(){this_.prev(".top").remove();})
});

      

.one

and .two

both are the same function. But I want to know why the second function affects usage setTimeout()

and the time is 0 milliseconds, Why is 0 millisecond affected in my function?

Demo: http://jsfiddle.net/nShCy/

+3


source to share


2 answers


It's not 0ms, 4ms delay .



The answer is simple: mouseenter fires on hover, so you are trying to remove an element that doesn't exist yet. With a 4ms break and a hover callback that finishes in less than 4ms, it works as expected.

+2


source


$(function(){

            $("div.one > .content").on("hover" , function(){
            var this_ = $(this);
            this_.prev(".top").remove();
        });


        $("div.two > .content").on("hover" ,function(){
            var this_ = $(this);
            setTimeout(function(){this_.prev(".top").remove();})
        });

})

      



-2


source







All Articles