Javascript 向复选框属性添加数字并限制复选框的数量

Javascript 向复选框属性添加数字并限制复选框的数量,javascript,jquery,Javascript,Jquery,下表中有复选框,可以比较每一行中最多3个要比较的项目 所以我想要一些只允许选中3个复选框的jQuery,然后它会在name属性的末尾动态添加一个数字 因此,如果有2个要比较,名称属性将是“horse_1”和“horse_2” 我不知道从哪里开始 <tr> <td><input type="checkbox" value="2560092" name="horse_"></td> <

下表中有复选框,可以比较每一行中最多3个要比较的项目

所以我想要一些只允许选中3个复选框的jQuery,然后它会在name属性的末尾动态添加一个数字

因此,如果有2个要比较,名称属性将是“horse_1”和“horse_2”

我不知道从哪里开始

        <tr>
            <td><input type="checkbox" value="2560092" name="horse_"></td>
            <td>1</td>
        </tr>
        <tr>
            <td><input type="checkbox" value="2560093" name="horse_"></td>
            <td>2</td>
        </tr>
        <tr>
            <td><input type="checkbox" value="2560094" name="horse_"></td>
            <td>3</td>
        </tr>
        <tr>
            <td><input type="checkbox" value="2560095" name="horse_"></td>
            <td>4</td>
        </tr>

1.
2.
3.
4.

您可以使用以下方法获取所选元素的数量:

var selected = $('input:checked')
selected.length
如果选定元素的数量为3,则可以禁用所有未选中的输入。这里使用jQuery:not()选择器获取:checked属性的倒数

    if (selected.length == 3) {
        $("input:not(:checked)").prop('disabled', true);
    }
然后添加else语句,以便如果未选择3,则不会禁用任何输入

    else {
        $("input").prop('disabled', false);
    }
然后,您可以使用.each()对每个选中的元素进行迭代以更新其名称,使用集合中元素的索引作为数字,将1添加到值中以对抗零索引:

    $('input:checked').each(function(index, element) {
        $(element).attr('name', 'horse_' + (index + 1));
    });

首先收听
change
事件。您希望限制用户可以从可用复选框中选择任意三个复选框的UI。。对..?当他们点击第四个按钮时会发生什么?它不会被选中,或者应该通过取消选择第一项来循环选择?