Aide avec la fonction jQuery simple

Question

J'ai ce bit de code.

Ce que je veux, c'est quand je clique sur .delbutton #slide va se cacher.

$(document).ready(function() { 
    var slide = $('#slide') 
    $('.link').click(function() { 
     slide.animate({'bottom' : '0px'}, 500).append('<div class="delbutton"></div>')    
    }); 
}); 

$(document).ready(function(){ 
    $('.delbutton').click(function() { 
     $('#slide').hide() 
    })      
}) 

Impossible de déterminer ce qui ne va pas. Je ne travaille pas.

Merci pour votre aide

Answer 1

Votre fonction de clic n'est pas appliquée à quoi que ce soit car la valeur DIV à laquelle vous l'ajoutez n'existe pas au moment où elle est appliquée. Vous devez utiliser le gestionnaire live, qui fonctionnera pour un gestionnaire de clic, mais pas pour tous les types d'événements.

$(".delbutton").live("click", function(){ 
    $('#slide').hide(); 
}); 

Answer 2

Vous pouvez utiliser live() comme cela a été suggéré dans d'autres réponses, ou mettre en place le gestionnaire d'événements de clic au point de créer <div class="delbutton">. BTW, est-il intentionnel qu'il n'a aucun contenu?

$(document).ready(function(){ 
    var slide = $('#slide') 
    $('.link').click(function(){ 
     var div = $('<div class="delbutton">Delete</div>').click(function(){ 
      slide.hide(); 
     }); 
     slide.animate({'bottom' : '0px'}, 500).append(div) 
    }); 
}); 

Answer 3

function(){$('#slide').hide();} 

peut-être des points-virgules à la fin de peau() est nécessaire?

P.s. Utilisez FireBug firefox add-on à des fins de déboguage JS si vous ne le faites pas déjà.

Answer 4

La seule chose évidente pour moi est que vous avez manqué un point-virgule ici:

var slide = $('#slide') 

Et vous ajoutez un événement de clic à quelque chose qui n'existe pas (encore) ...

$(document).ready(function(){ 
    $('.link').click(function(){ 
     $('#slide').animate({'bottom' : '0px'}, 500).append('<div class="delbutton"></div>'); 
    }); 
    $('.delbutton').live(function(){ 
     $('#slide').hide(); 
    }); 
}); 

Answer 5

Vous devez joindre l'événement sur .delbutton après qu'il a été joint comme ceci:

$(document).ready(function(){ 
    var slide = $('#slide') 
    $('.link').click(function(){ 
     slide.animate({'bottom' : '0px'}, 500).append('<div class="delbutton"></div>'); 
     $('.delbutton').click(function(){ 
      $('#slide').hide(); 
     }); 
    }); 
}); 

Une autre façon de sol Ce problème serait d'utiliser la fonction live() pour faire la liaison, cela affecterait non seulement les éléments du DOM, mais ceux qui seront ajoutés. La façon dont vous faites ceci est un peu fictive car vous ajoutez un div chaque fois que vous vous connectez sur le .link. Il serait préférable de ne le créer qu'une seule fois, puis de le montrer/cacher, ou l'avoir créé dès le début, puis l'afficher/masquer.