javascript - フォーム送信時にチェックボックスの値を取得し、jQuery を使用して変数に格納する

Question

「テスト」のクラスで複数のチェックボックスを使用するフォームを作成します（そのうちの1つだけをチェックできますが、ラジオボタンを使用するのと似ています-私の考えではありません！）。

フォームが送信されたら、チェックされているチェックボックスの値を取得して変数に保存したいのですが、ここで誰か助けてもらえますか?

乾杯！

クリス

Answer 1

$("form").submit(function() {
    var aVariable = $('input.test[type="checkbox"]:checked', this).val();
});

.val()undefinedチェックボックスがチェックされていない場合は、空の jQuery オブジェクトで呼び出された場合に返されます。

Answer 2

これはうまくいきます

$(function() {
    $("#frm1").submit(function() {
        $("input.test[type=checkbox]:checked").each(function() {
            alert($(this).val());
        });

        return false;
    });
});

Answer 3

コードビンで以下のソリューションを試してください：

注: 最初にヘッダー タグに最新の jquery.js JavaScript ファイルを追加します。

HTML:

<form id="frm1" method="post">
  <input type="radio" class="test" checked="checked" value="radio1">
  Radio1
  <input type="radio" class="test" checked="checked" value="radio2">
  Radio2
  <input type="radio" class="test" value="radio3">
  Radio3
  <br/>
  <input type="checkbox" class="test" checked="checked" value="check1">
  Check1
  <input type="checkbox" class="test" value="check2">
  Check2
  <input type="checkbox" class="test" checked="checked" value="check3">
  Check3
  <br/>
  <input type="submit" value="submit" />
</form>

Script タグ内の jQuery:

$(function() {

    $("#frm1").submit(function() {
        $("input.test[type=checkbox]:checked").each(function() {
            alert($(this).val());
        });

        return false;
    });
});

http://codebins.com/bin/4ldqpapで上記のビンを実行しました