javascript - 单击按钮时，使用 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 处放置什么代码来获取带有 class=hidden 的 div 的内容？
如果您点击第一个按钮，您应该得到 44，如果您点击第二个按钮，您将得到 12。

Answer 1

id's是独一无二的；您不妨考虑更改 id到 class . 有了它，您可以使用如下脚本来实现您想要的:

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

这是一个 JSFiddle 示例:JSFiddle

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