Jquery unbind events

Question

I have two scripts

$(".MakeBid").on('click', function(e) {
        e.preventDefault();
        if ($('#pop_up').length) {$('#pop_up').html("").height('auto').width('auto').offset({left:0,top:0});}
        var strSrc = 'index.asp?id=' + $(this).attr('id');
        $.get(strSrc, function(data) {
            if ($('#pop_up').length) {
                $('<iframe src="' + strSrc + '"/>').appendTo('#pop_up');
                $('#pop_up').show(function() {
                    $('#pop_up').height(150).width(800);
                    $('#pop_up').offset({top:e.pageY,left:e.pageX});
                    $('#pop_up').on( "mouseleave", function() {
                        if ($('#pop_up').length) {
                            $('#pop_up').html("").height('auto').width('auto').offset({left:0,top:0});
                            $('#pop_up').hide(); 

                        }
                        $('#pop_up').unbind();
                    });
                    $('.authorize-close').click(function(e){      
                        e.preventDefault();
                        if ($('#pop_up').length) {
                            $('#pop_up').html("");
                            $('#pop_up').hide(); 
                        }
                    });
                });
            }
        });
$(".MakeBid").unbind('click');
});

And

$(".Login").on('click', function(e) {
        e.preventDefault();
        if ($('#pop_up').length) {$('#pop_up').html("").height('auto').width('auto').offset({left:0,top:0});} //restore div position and offset
        var strSrc = 'index.asp?id=' + $(this).attr('id');
        $.get(strSrc, function(data) {
            if ($('#pop_up').length) {
                $('<iframe src="' + strSrc + '"/>').appendTo('#pop_up');
                $('#pop_up').show(function() {
                    $('#pop_up').height(150).width(800); //set div size
                    $('#pop_up').offset({top:e.pageY,left:e.pageX}); // set div offset
                    $('.authorize-close').click(function(e){     //on close button press  
                        e.preventDefault();
                        if ($('#pop_up').length) {
                            $('#pop_up').html(""); //empty div
                            $('#pop_up').hide(); // hide div
                        }
                    });
                });
            }
        });
$(".Login").unbind('click');
});

So when i click .MakeBid $('#pop_up').on( "mouseleave", activated and after close #pop_up and click on .Login $('#pop_up').on( "mouseleave", still working.

How to unbind this?

Try http://stackoverflow.com/questions/203198/event-binding-on-dynamically-created-elements — Arun P Johny, Sep 30 '15 at 08:54
have you tried `$('#pop_up').off( "mouseleave");` instead of `$('#pop_up').unbind();` from your first script. — vijayP, Sep 30 '15 at 08:54

score 1 · Accepted Answer · answered Sep 30 '15 at 08:56

you have to modifiy the $('#pop_up').unbind(); to $('#pop_up').off("mouseleave"); like below code

 $('#pop_up').on( "mouseleave", function() {
                    if ($('#pop_up').length) {
                        $('#pop_up').html("").height('auto').width('auto').offset({left:0,top:0});
                        $('#pop_up').hide(); 

                    }
                    $('#pop_up').off("mouseleave");
                });

Jquery unbind events

1 Answers1