单击按钮,使用JQuery选择同级元素

Question

我有这个代码:

<div class="item">
  <div class="hidden">44</div>
  <input type="submit" id="btnAddCommentForAnswer" value="Add Comment" />
  <script type="text/javascript">
    $(document).ready(function () {
        $('#btnAddCommentForAnswer').click(function () {
            alert(XXX);
        });

    });
  </script>    
</div>

<div class="item">
  <div class="hidden">12</div>
  <input type="submit" id="btnAddCommentForAnswer" value="Add Comment" />
  <script type="text/javascript">
    $(document).ready(function () {
        $('#btnAddCommentForAnswer').click(function () {
            alert(XXX)
        });

    });
  </script>  
</div>

当我在class = item的同一个div上按下按钮时,我应该在XXX处使用什么代码来获取div = hidden的内容？
如果单击第一个按钮,则应获得44,而单击第二个按钮则获得12.

Answer 1

id's意味着独特; 您可能希望考虑将其更改id为a class.有了这个,你可以使用如下的脚本来实现你想要的:

$(document).ready(function() {
    $('.btnAddCommentForAnswer').click(function() {
        alert($(this).siblings('.hidden').text());
    });
});

这是一个JSFiddle示例:JSFiddle

此外,您的脚本中不需要两个脚本标记!包含在<script>标签中的这个脚本就是必要的:)