0

我有一个小 jquery 显示/隐藏脚本。我遇到的问题是它显示了所有的选择器。我只希望它显示被点击的 div 内的那个。

HTML

<!--row1 -->
    <div class="row resource-line-item">
     <div class="zone1">
       <h3 class="clickable">ANDALE.TTF - True Type Font</h3>
       <span class="edit-resource">Edit</span> 
     </div>
    <div class="zone2 printer-state">
       <p> Size: 4153344 <br>
           Date: Tuesday, March 26, 2013 2:14:14 PM</p>
    </div>
    <div style="display: none;" class="edit-Box"> </div>
    </div>

<!--row2 -->
    <div class="row resource-line-item">
     <div class="zone1">
       <h3 class="clickable">ANDALE.TTF - True Type Font</h3>
       <span class="edit-resource">Edit</span> 
     </div>
    <div class="zone2 printer-state">
       <p> Size: 4153344 <br>
           Date: Tuesday, March 26, 2013 2:14:14 PM</p>
    </div>
    <div style="display: none;" class="edit-Box"> </div>
    </div>

查询

<script type="text/javascript">
     $("#resource-list-area .edit-resource").on("click", function(event){
     $(this).next(".edit-box").toggle();
       //alert('hello')
     });
    </script>
4

2 回答 2

4

再次，猜测那是你的标记

$("#resource-list-area").on("click", ".edit-resource", function(event) {
    $(this).closest(".row").find(".edit-Box").toggle();
});

见工作小提琴：http: //jsfiddle.net/xZBje/1

于 2013-04-10T17:09:37.680 回答
0 
$(".edit").click(function() {
    $(this).next().toggle();
});
于 2013-04-10T17:10:36.410 回答