The front-end quick note-js monitors the number of checkboxes selected and limits the number of choices at most

1. Front-end interface

The selected checkboxes are displayed below;
when the number of selected checkboxes reaches the maximum value, the checkboxes cannot be selected.
Insert picture description here

Insert picture description here

        <tr>
            <td><%=carriage%></td>
            <td><%=location%></td>
            <td><input type="checkbox" value="" name="checkboxName" class="checkboxStyle"></td>
        </tr>
<p>选座喽!已选座<span class="count">0</span>/<%=users.size()%></p>

js logic

//    得到选中的checkbox个数
//点击完成时显示已选个数
$(".checkboxStyle").click(function(){
    
    

    var chk=$(".checkboxStyle");
    var len = chk.filter(":checked").length;
    if(len><%=users.size()%>){
    
    
            if($(this).prop('checked')) {
    
    
                return false;
            }
    }else{
    
    
            $(".count").html(len);
    }

})

Guess you like

Origin blog.csdn.net/joey_ro/article/details/108736682