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

Add number to checkbox attributes and limit number of checked checkboxes

本文关键字：复选框 属性 添加 数字      更新时间：2023-09-26

我有下表，其中有复选框，可以比较每行中的内容，最多可以比较3项。

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

因此，如果有2个要比较，名称属性将是"horse_1"answers"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>

您可以使用获取所选元素的数量

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);
    }

然后，您可以使用.ech（）对每个检查的元素进行迭代，以更新它们的名称，使用集合中元素的索引作为数字，在值上加1来计数零索引：

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

http://jsfiddle.net/bj8L0ct2/1/

相关文章：