javascript - 尝试使用jquery获取元素并将它们存储在数组中

Question

我有一个像这样的 html 结构:

<tr>
    <td>NC</td>
    <td><%= @subscriptions.where("users.ranking = 'NC'").count %></td>
    <td><input type="checkbox" name="my-checkbox" class="checkbox-ranking" id="bite" data-size='small'></td>
</tr>
<tr>
    <td>40</td>
    <td><%= @subscriptions.where("users.ranking = '40'").count %></td>
    <td><input type="checkbox" name="my-checkbox" class="checkbox-ranking" data-size='small' ></td>
</tr>
<tr>
    <td>30/5</td>
    <td><%= @subscriptions.where("users.ranking = '30/5'").count %></td>
    <td><input type="checkbox" name="my-checkbox" class="checkbox-ranking" data-size='small' ></td>
</tr>

我需要编写一个脚本，每次选中复选框时都会获取第一个<td></td>的innerhtml每个<tr></tr>其中复选框被选中并将其作为数组返回。

这是我的想法:

$(document).ready(function(){
    $('.checkbox-ranking').on('change', function() {
        var rankings = $('.checkbox-ranking:checked').map(function() {
            return $(this).parent().parent().parent().parent().children().first().html();
        }).get().join(',');
        alert(rankings);
    });
});

我必须补充一点，我安装了 gem bootstrap-switch 以具有 ON/OFF 开关按钮，这就是我的复选框。我注意到我打开了按钮，它没有传递到 checked在 html 代码中，所以我想这就是我的代码无法工作的原因:脚本实际上没有检测到更改事件。

还有其他想法吗？

Answer 1

好的，现在可以了

$(document).ready(function(){
    $('.checkbox-ranking').on('change', function() {
        var rankings = $('.checkbox-ranking:checked').map(function() {
            return $(this).parent().parent().find('td:first-child').html();
        }).get().join(',');
        alert(rankings);  
    });
});

和jsfiddle:https://jsfiddle.net/btrauybx/2/