jquery統計復選框選中示例

2024-05-06 15:54:05

字體：大中小

來源：轉載

供稿：網友

在jquery中如果我們要獲取選中的checkbox我們可以input:checked,然后獲取選中checkbox個數量時我們可以使用jQuery的size()方法或length屬性來判斷就行了

以前我使用js只能判斷遍歷再獲取

復制代碼代碼如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery判斷復選框的選中個數</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
window.onload = function(){//頁面所有元素加載完畢
var btn = document.getElementById("btn"); //獲取id為btn的元素(button)
btn.onclick = function(){ //給元素添加onclick事件
var arrays = new Array();   //創建一個數組對象
var items = document.getElementsByName("check"); //獲取name為check的一組元素(checkbox)
for(i=0; i < items.length; i++){ //循環這組數據
   if(items[i].checked){      //判斷是否選中
    arrays.push(items[i].value); //把符合條件的添加到數組中. push()是javascript數組中的方法.
   }
}
alert( "選中的個數為："+arrays.length );
}
}
</script>
</head>
<body>
<form method="post" action="#">
<input type="checkbox" value="1" checked="checked"/>
<input type="checkbox" value="2" />
<input type="checkbox" value="3" checked="checked"/>
<input type="button" value="你選中的個數"/>
</form>
</body>
</html>