显示多个选择器中的一个

Show 1 of many selectors

本文关键字：一个 选择器 显示      更新时间：2023-09-26

我有一个小的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>
JQUERY 

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

再次猜测这是您的标记

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

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

$(".edit").click(function() {
    $(this).next().toggle();
});
相关文章：