jQuery toggle && ce numéro

Question

Comment puis-je basculer #editbox div alors que #plus est cliqué? J'ai plusieurs champs #boxt & & #editfield. Je peux le faire fonctionner seulement pour le premier div.

boxt est visible
editbox est caché

<div id="boxt"> 
<div id="editbox"></div> 
<span id="plus" class="glyphicon glyphicon-plus"></span> 
</div> 

<div id="boxt"> 
<div id="editbox"></div> 
<span id="plus" class="glyphicon glyphicon-plus"></span> 
</div> 

... etc comme 10x

Je tentais quelque chose comme:

<script> 
$(document).ready(function(){ 
    $('#boxt').click(function(){ 
    $(this).find("#editfield").toggle(); 
    });       
}); 
</script> 

Answer 1

Notez que vous ne pouvez pas donner beaucoup HTML balise les mêmes id que vous l'avez fait avec editbox & plus. Au lieu de cela, vous devez utiliser class, et voici une démonstration:

$(document).ready(function(){ 
 
    $('.boxt').click(function(){ 
 
    $(this).find(".editbox").toggle(); 
 
    });       
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="boxt"> 
 
TEXT ON BOXT 1 
 
<div class="editbox">Text on EDITBOX 1</div> 
 
<span class="glyphicon glyphicon-plus plus"></span> 
 
</div> 
 
<hr/> 
 
<div class="boxt"> 
 
TEXT ON BOXT 2 
 
<div class="editbox">Text on EDITBOX 2</div> 
 
<span class="glyphicon glyphicon-plus plus"></span> 
 
</div>