jQuery切換&&此問題

Question

如何在單擊#plus時切換#editbox div？我有multipe #boxt & & #editfield字段。我可以讓它只適用於第一格。

boxt可見
編輯框隱藏

<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> 

...等類似10X

我嘗試類似：

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

Answer 1

請注意，你不能給多HTML標記相同id與您使用editbox & plus。相反的，你應該使用class，這裏是一個演示：

$(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>