Monday, 9 July 2012

JQuery not fire Click event

Copied from  http://stackoverflow.com/questions/5540561/jquery-click-event-not-firing


8
down voteaccepted
Is this markup added to the DOM asynchronously? You will need to use live in that case:
<script>
    $(document).ready(function(){
        $('.play_navigation a').live('click', function(){
            console.log("this is the click");
            return false;
        });
    });
</script>
The fact that you are able to re-run your script block and have it work tells me that for some reason the elements weren't available at the time of binding or the binding was removed at some point. If the elements weren't there at bind-time, you will need to use live (or event delegation, preferably). Otherwise, you need to check your code for something else that would be removing the binding.
EDIT using jQuery 1.7 event delegation:
$( function () {

    $( '.play_navigation' ).on( 'click', 'a', function ( e ) {
        console.log( 'this is the click' );
        e.preventDefault();
    });
});