JSFiddle - React, Tailwind, and code Playground

by wllai2001

HTML

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<!--CheckBoxList項目檢查20180223-->

<!-- // Asp.Net編譯前
<asp:CheckBoxList ID="cbl_Laterality" runat="server">
  <asp:ListItem Text="Left"></asp:ListItem>
  <asp:ListItem Text="Right"></asp:ListItem>
</asp:CheckBoxList>
// -->

<!-- // Asp.Net編譯後-->
<table id="cbl_Laterality">
	<tbody><tr>
		<td><input id="cbl_Laterality_0" type="checkbox" name="cbl_Laterality$0" value="Left"><label for="cbl_Laterality_0">Left</label></td>
	</tr><tr>
		<td><input id="cbl_Laterality_1" type="checkbox" name="cbl_Laterality$1" value="Right"><label for="cbl_Laterality_1">Right</label></td>
	</tr>
</tbody></table>
<!-- // Asp.Net編譯後-->

<input type='button' value='檢查CheckBoxList'/>

JavaScript

$(function(){
	$("input:button").on('click',function(){
		var cc = 0;
  	$.each($('#cbl_Laterality :checkbox'),function(){
			if($(this).prop("checked")){
				cc++;
			}
		});

		if(cc==0){
    	alert('請至少勾選一項');
    }else{
			alert('已勾選 '+cc+' 項');
		}
  });
});