在表单提交中获取复选框值,并使用jQuery将其存储在变量中

Get checkbox value on form submit and store in a variable using jQuery

本文关键字:jQuery 存储 变量 获取 表单提交 复选框      更新时间:2023-10-27

有一个使用多个复选框的表单,该复选框的类为"test"(只能检查其中一个复选框,但与使用单选按钮类似-不是我的想法btw!)。

提交表单时,我想获得选中的复选框的值,并将其存储在变量中——这里有人能帮忙吗?

干杯!

Chris

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

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

请在码本上尝试以下解决方案:

注意:首先在header标记上添加最新的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

这将适用于

$(function() {
    $("#frm1").submit(function() {
        $("input.test[type=checkbox]:checked").each(function() {
            alert($(this).val());
        });
        return false;
    });
});
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)