lionel28
lionel28

Reputation: 65

Jquery live blur and live focus

I am opening up a dialog box dynamically. When click on a link it looks for info and display it in it.

$('.comment').live('blur', function(){
    var split = (this.id).split("_");
    var id = split[1];

    $('#face_'+ id).fadeOut();
    $('.commentbutton').hide();
    $("#comments_" + id).slideDown();
})

//////////////////////////////////////////////////

// commentopen 
$(".comment").live("focus", function() { 
    var split = (this.id).split("_");
    var vmid = split[1]; 

    $("#face_" + vmid).fadeIn();
    $("#comments_" + vmid).slideUp();
    $('#commentbutton_' + vmid).show();

});

That works fine when you first open the dialog, but if you close it and try to open it again, it no longer works, at least in firefox.

When I put an alert it shows that the ID was sent. But why $('.commentbutton') and #face_' + vmid no longer fadeIn(), slideUp(), slideDown() and blur function does nothing?

I also tried with focusin and focusout.

Thanks.

Upvotes: 1

Views: 8346

Answers (2)

adeneo
adeneo

Reputation: 318322

$(document).on({
    blur: function(){
        var id = this.id.split("_")[0];
        $('#face_'+id).fadeOut();
        $('.commentbutton').hide();
        $("#comments_"+id).slideDown();
    },
    focus: function() {
        var vmid = this.id.split("_")[1];
        $("#face_"+vmid).fadeIn();
        $("#comments_"+vmid).slideUp();
        $('#commentbutton_'+vmid).show();
    }
},'.comment');

Replace document with the closest non dynamic parent. As for why it's not working on second click, that's really hard to answer without seeing more of the actual code.

Upvotes: 0

Elen
Elen

Reputation: 2343

with the new versions of jquery live() is deprecated instead you should use on() (note the new format):

$(document).on('blur','.comment', function(){
   var split = (this.id).split("_");
   var id = split[1]; 
   $('#face_'+ id).fadeOut();
   $('.commentbutton').hide();
   $("#comments_" + id).slideDown();
});
         //////////////////////////////////////////////////

         // commentopen 
$(document).on("focus",".comment", function() { 
   var split = (this.id).split("_");
   var vmid = split[1]; 

   $("#face_" + vmid).fadeIn();
   $("#comments_" + vmid).slideUp();
   $('#commentbutton_' + vmid).show();

});

http://api.jquery.com/on/

Upvotes: 0

Related Questions