jquery pour ajouter une cellule sans actualiser la page

Question

Je souhaite ajouter une cellule dans une section chaque fois que je clique sur le bouton Ajouter. La page est mise à jour sans actualisation. Le code HTML est:

<section> 
    <p class="cell">content</p> 
</section> 
<button type="button" id="addCell">add</button> 

Comment dois-je mettre en œuvre les js Merci!

Answer 1

Très simple, utilisez append() ou after(). Dans votre cas append() fonctionnera mieux.

$('#addCell').bind('click',function(){ 
    $('section').append('<p class="cell">content2</p>'); 
}); 

Malheureusement, je ne peux pas vous montrer une démo car jsFiddle est en cours de maintenance.

Demo dans jsbin: http://jsbin.com/agosap/

Answer 2

$(document).ready(function() { 
    $("#addCell").click(function() { 
     $("section").append('<p class="cell">content</p>'); 
    }); 
}); 

Answer 3

Je ne vais pas vous donner le code que vous nous avez pas montré ce que vous avez essayé, mais je vais vous guider.

Vous souhaitez lier un événement click au bouton afin de pouvoir effectuer des opérations lorsque l'utilisateur clique dessus. Vous pouvez créer des éléments en utilisant JS document.createElement ou using jQuery. Donc, à l'intérieur de l'événement click, créez l'élément que vous voulez, donnez-le attributes que vous voulez, puis append à la div parente.