Home > DeveloperSection > Forums > jquery, my function is executed a lot of time instead of one
Ankita Pandey
Ankita Pandey

Total Post:183

Points:1285
Posted on    April-09-2013 2:01 AM

 JQuery JQuery 
Ratings:


 1 Reply(s)
 864  View(s)
Rate this:
Hi Everyone!

when i'm clicking on .myClass I want 'a ' to appear before #message unfortunately 'a a a a a' appear instead of it.

My css are:

    #message{
    width: 80%;
    height: 10%;
    border-style:solid;
    border-width:5px;
}


 .hideIt{
    visibility:hidden;
}
and my code is:

<div id="message">test1 <span class="myClass hideIt">test2</span></div>

    <script src="jquery.js"></script>
    <script>
    $(function() {

        test = function() { $('#message').before('a '); }

        $(document).on('mouseover', '#message', function () {
            var el = $(this);
            el2 = el.children('.myClass');
            el2.removeClass('hideIt');
            el2.on('click',test);
            el.on('mouseout', function() {
                el2.addClass('hideIt');
            });
        });

    });
    </script>
here a Fiddle link: http://jsfiddle.net/TDJVw/

Thanks in advance! 



AVADHESH PATEL

Total Post:604

Points:4228
Posted on    April-09-2013 7:41 AM

Hi Ankita!

Your problem was that you was registering the click method each time the div was hovered. I moved the click outside of the hover method.

Don't want to miss updates? Please click the below button!

Follow MindStick