使用jQuery获取表单提交并存储在变量中的复选框值答案

【问题标题】：Get checkbox value on form submit and store in a variable using jQuery使用jQuery获取表单提交并存储在变量中的复选框值
【发布时间】：2012-07-15 23:24:57
【问题描述】：

有一个使用多个复选框和一个“测试”类的表单（只有一个可以检查，但类似于使用单选按钮 - 顺便说一句，不是我的想法！）。

提交表单后，我想获取选中的复选框的值并将其存储在一个变量中 - 任何人都可以在这里提供帮助吗？

干杯！

克里斯

【问题讨论】：

标签： javascript jquery forms checkbox

【解决方案1】：

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

.val() 如果在空的 jQuery 对象上调用，则返回 undefined，如果没有选中复选框，则会出现这种情况。

【讨论】：

【解决方案2】：

请在代码箱上尝试以下解决方案：

注意：首先在标头标签上添加最新的 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>

脚本标签内的jQuery：

$(function() {

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

        return false;
    });
});

我已经在http://codebins.com/bin/4ldqpap上面完成了bin

【讨论】：

【解决方案3】：

这会起作用

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

        return false;
    });
});

【讨论】：

如果您可以添加一些代码解释会很好 - 它可能对其他用户更有帮助。

【解决方案4】：

var inputElements = document.getElementsByClassName('messageCheckbox');
    var checkedValue=[];
    for(var i=0; inputElements[i]; ++i){
       console.log(inputElements[i]);
       if(inputElements[i].checked){
           checkedValue.push(inputElements[i].value);
       }
    }
alert(checkedValue)

【讨论】：