按名称获取复选框的值答案

【问题标题】：Get value of checkbox by name按名称获取复选框的值
【发布时间】：2012-12-16 06:40:35
【问题描述】：

我需要按名称获取复选框的值。我有以下代码：

<input type="hidden" name="my_checkbox" value="0">
<input type="checkbox" name="my_checkbox" id="my_checkbox_id" value="1"  />

这个想法是，如果未选中该复选框，我将获得隐藏输入类型的值（即 0）。

这是我尝试过但没有奏效的方法：

$('input[name=my_checkbox]').val();

但是，这会返回隐藏输入和复选框的值。谁能告诉我如何在选中 (1) 时获取复选框的值，或者在未选中时获取隐藏输入 (0) 的值？我想这必须按名称完成，这样如果未选中复选框，我将获得隐藏输入的值，就好像未选中复选框一样，您将无法获得其值。

【问题讨论】：

我会在隐藏元素上添加一个 ID，这样我就可以独立检索这两个元素。
只是出于好奇，你的价值观会一直是0 和1 吗？
@roXon 是的，如果选中该复选框，则为 1，否则为 0。这不适用于 1 个复选框，我有一组复选框可以做同样的事情
为什么需要0 值复选框（隐藏的一个）？你根本不需要它。
@roXon 此值存储在数据库中，因此在页面加载时我根据需要选中/取消选中复选框

标签： javascript jquery html jquery-mobile

【解决方案1】：

<input type="hidden" name="my_checkbox" value="0">
<input type="checkbox" name="my_checkbox" id="my_checkbox_id" value="1"  />

试试这个它对我有用：

$( 'input[name="my_checkbox"]:checked' ).val();

【讨论】：

【解决方案2】：

其实你不需要隐藏的，你只需要说：
if checkbox is not checked set his value to '0'
这就是你所需要的：

$('input:checkbox').not(':checked').val(0);

【讨论】：

【解决方案3】：

只需找到:visible 复选框：

$('input[name="my_checkbox"]:visible').change(function() {
  if ($('input[name="my_checkbox"]:visible').is(':checked')) {
    alert($('input[name="my_checkbox"]:visible').val());
  } else {
    alert($('input[name="my_checkbox"]:hidden').val());
  }
});

试用小提琴：http://jsfiddle.net/JgzGa/1/

【讨论】：

即使未选中复选框，也始终返回 1
@roXon 请查看更新的小提琴和答案。是的，只是错过了正确阅读问题，为此道歉。

【解决方案4】：

你为什么不这样做：

if($("#my_checkbox_id").is(':checked')) {
    output = $("#my_checkbox_id").val();
} else {
    output = $('input[type=hidden]').val();
}

【讨论】：

【解决方案5】：

您可以为其添加一个新功能：

$.fn.checkboxVal = function() {
    var checked = $(this).filter("[type=checkbox]:checked");
    if (checked.length)
        return checked.val();

    return $(this).filter("[type=hidden]").val();
};

然后你可以说$("input[name=foo]").checkboxVal()，它会给你正确的值。

未经测试，因此修复任何错误留给读者作为练习。

【讨论】：