如果在jquery中選中第一個復選框，如何獲取下一個復選框值？

Question

<script type="text/javascript">
    $(document).ready(function() {
        $('.list-dis input[type="checkbox"]').each(function() {
            if ($(this).closest('tr').index() !== 0) {
                $(this).prop('disabled', true).hide()
                $(this).next().show()
            }
        }).on('change', function() {
            $(this).prop('disabled', true)
            $(this).closest('tr').next('tr').find('input[type="checkbox"]').prop('disabled', false).show()
            .next().hide()
        });
    });
</script>
<table>
    <tr>
        <td>
            <input type="checkbox" class="test" id="16"> value 1
        </td>
        <td>
            <input type="checkbox" class="test" id="17"> value 2
        </td>
        <td>
            <input type="checkbox" class="test" id="18"> value 3
        </td>
        <td>
            <input type="checkbox" class="test" id="19"> value 4
        </td>
        <td>
            <input type="checkbox" class="test" id="20"> value 5
        </td>
    </tr>
</table>
                                                                  

在上面的代碼中，當我單擊第一個復選框時，現在所有復選框都被禁用而不是第一個復選框，然后下一個復選框將啟用，第一個復選框被禁用，這工作正常。 現在，當我檢查第一個復選框時我想要什么，然后它會在警報中顯示下一個復選框值。 那么，我該怎么做呢？ 請幫我。

謝謝你

Answer 1

你可以添加這樣的東西：

var nexttd = $(this).closest('td').next('td');
if (nexttd.length != 0) alert($("input",nexttd).attr("id"))

演示

 $(document).ready(function() { $('.list-dis input[type="checkbox"]').each(function() { if ($(this).closest('tr').index() !== 0) { $(this).prop('disabled', true).hide() $(this).next().show(); } }).on('change', function() { $(this).prop('disabled', true) $(this).closest('tr').next('tr').find('input[type="checkbox"]').prop('disabled', false).show() .next().hide(); var nexttd = $(this).closest('td').next('td'); if (nexttd.length != 0) alert($("input",nexttd).attr("id")) }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table class="list-dis"> <tr> <td> <input type="checkbox" class="test" id="16"> value 1 </td> <td> <input type="checkbox" class="test" id="17"> value 2 </td> <td> <input type="checkbox" class="test" id="18"> value 3 </td> <td> <input type="checkbox" class="test" id="19"> value 4 </td> <td> <input type="checkbox" class="test" id="20"> value 5 </td> </tr> </table>