如何根据选中的复选框选择div中的最后一个元素

Question

$(".a").on('click',function(){
   alert($(this).next('input[type="hidden"]').attr('value'))

})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="id">
    <div>
        <strong><input type="checkbox" value="1" class="a"> chbox1</strong>
         <input type="hidden" value="1">   
    </div>    
    <div>
        <strong><input type="checkbox" value="1" class="a"> chbox1</strong>
         <input type="hidden" value="2">   
    </div>    
</div>

当我更改复选框状态时，如何获取隐藏元素值？
有谁知道让我知道？
谢谢

Answer 1

代码中隐藏的输入不是您的复选框的兄弟，您首先应使用$(this).parent()或$(this.parentNode)选择父元素。

$(this.parentNode).next('input[type="hidden"]').val();

Answer 2

input是您的父strong元素的兄弟，所以首先获取父级，然后查找.next('input[type="hidden"]')。

此外，您可以使用.val()代替.attr('value')。

＆＃13;

＆＃13;

$(".a").on('click',function(){
   alert($(this).parent().next('input[type="hidden"]').val())

})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="id">
    <div>
        <strong><input type="checkbox" value="1" class="a"> chbox1</strong>
         <input type="hidden" value="1">   
    </div>    
    <div>
        <strong><input type="checkbox" value="1" class="a"> chbox1</strong>
         <input type="hidden" value="2">   
    </div>    
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 3

以下是使用两个parent方法调用查找的div元素，然后find用于搜索隐藏元素。我刚刚发现（在另一个stack post中）也可以使用更改来检测复选框选择更改。

$(".a").on('click',function(){
   alert($(this).parent().parent().find('input[type="hidden"]').attr('value'))

})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div id="id">
    <div>
        <stong><input type="checkbox" value="1" class="a"> chbox1</stong>
         <input type="hidden" value="1">   
    </div>    
    <div>
        <stong><input type="checkbox" value="1" class="a"> chbox1</stong>
         <input type="hidden" value="2">   
    </div>    
</div>