jqueryでチェックボックスの選択された値を取得する方法-HTMLの知識-php.cn

jqueryでチェックボックスの選択された値を取得する方法

藏色散人

リリース： 2018-11-20 09:20:53

オリジナル

15049 人が閲覧しました

この記事では、チェックボックスで選択されている値を取得するjqueryの実装方法を中心に紹介します。

前回の記事では、jsを使ってチェックボックスの選択値を取得する方法を紹介しました実装の考え方は難しくなく、誰もがある程度の理解を持っているはずです。それの。次に、jquery を使用してチェックボックスの選択された値を取得する方が、js メソッドよりも簡単です。

以下では、チェックボックスで選択された値 を取得する jquery の実装方法を、具体的なコード例を用いて詳しく紹介します。

コードは次のとおりです。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<input type="checkbox" name="test" value="0"/>0
<input type="checkbox" name="test" value="1"/>1
<input type="checkbox" name="test" value="2"/>2
<input type="checkbox" name="test" value="3"/>3
<input type="checkbox" name="test" value="4"/>4
<input type="checkbox" name="test" value="5"/>5
<input type="checkbox" name="test" value="6"/>6
<input type="checkbox" name="test" value="7"/>7
<input type="button" onclick="jqchk()" value="提 交"/>
</body>
<script src="./js/jquery-1.4.4.min.js"></script>
<script>
 function jqchk(){ //jquery获取复选框值
 var chk_value =[];
 $(&#39;input[name="test"]:checked&#39;).each(function(){
            chk_value.push($(this).val());
 });
 alert(chk_value.length==0 ?&#39;你还没有选择任何内容！&#39;:chk_value);
 }
</script>
</html>

ログイン後にコピー

実装結果は次のとおりです。

jqueryでチェックボックスの選択された値を取得する方法