Question

val()对于复选框控件是否有用是否有一些理由，而对于在每个其他输入控件上一致地获取输入数据有用吗？

e.g。对于复选框，无论复选框状态如何，at似乎始终返回“on”。对于实际上没有“value”属性的其他输入控件，例如select和textarea，它的行为与您期望的一样。参见：

我无法想到它不会返回true或false的充分理由。如果失败了，至少只有在选中时才会返回“on”，而在没有时则返回空字符串。如果失败，至少总是返回一个空字符串，因为复选框没有value属性！

显然我知道如何使用attr来获取价值，但这是情况。我正在开发一个简单的（迄今为止无论如何）C＃jQuery实现来在服务器上进行HTML解析，我正在努力完全忠实于jQuery的实现，因此它在客户端或服务器上针对相同的DOM表现一致。但这似乎很愚蠢，我很难让自己实际编码“值”，无论如何都要为复选框返回“ON”。但如果我不这样做，那就不一致了。所以我想了解，有这样做的原因吗？它是出于某种目的，还是仅仅是某种神器？是否有人会使用val()方法对付复选框，如果有，为什么？如果没有，为什么jQuery架构师决定使用这种方法使其无用？

Answer 1

我想不出一个很好的理由不会返回真或假。失败那，至少只有当“开启”时检查，否则为空字符串。如果做不到这一点，至少总会回来一个空字符串，给出复选框没有价值属性！

复选框确实有值属性。在例如使用它是很常见的。表单中的多个复选框，例如：

<input type="checkbox" name="foo[]" value="1" />
<input type="checkbox" name="foo[]" value="2" />

然后，当用户提交表单时，服务器可以通过检查foo[]数组的值来解析检查了哪个复选框。复选框的值不会更改是否已选中;浏览器根本不会将未选中复选框的值发送到服务器。如果你这样做。在jQuery中$('#your-form').serialize()，它的工作方式应该类似;它不应包含未选中复选框的值。如果省略复选框中的值，则默认为on。

如果你想检查jQuery中是否选中了一个单独的复选框，最好的描述方式是$(this).is(':checked')

Answer 2

你说“复选框没有value属性”。相反：value属性在复选框和单选框上是可选的除了。

来自the W3C specifications：

[value属性]是可选的，除非type属性的值为“radio”或“checkbox”

on是您忽略规范时浏览器为元素提供的默认值，并且未设置value属性。

您需要记住值的含义：在提交表单时，它会与元素的name一起发送到服务器。如果未选中，则不会发送该值。因此，仅在选中复选框时才会发送值on。

Answer 3

也许这应该有帮助

$(document).ready(function() {
    $('input[type=checkbox]').click(function() {
      alert("val="+$(this).val()+",checked="+$(this).attr('checked'));
    });

});

使用input[type=checkbox]选择input type="checkbox"，因为复选框已输入并输入type =“checkbox”

并且还将值属性设置为复选框。

在jsfiddle

上

<强>更新

<form method="post" action="#">
    PHP<input type="checkbox" name="ch[]" value="PHP"><br/>
    JS<input type="checkbox" name="ch[]" value="JS"><br/>
    JAVA<input type="checkbox" name="ch[]" value="JAVA"><br/>
    PYTHON<input type="checkbox" name="ch[]" value="PYTHON"><br/>
    <input type="submit" name="submit"/>
</form>

和php

if($_POST){
foreach($_POST['ch'] as $post => $value){
    echo "$post -> $value <br/>";
}
}

它们都具有相同的名称，因为它们是一组共同的按钮。你知道哪些被检查了，哪些不是通过他们的价值观。

另一种方式是

if($_POST){
    foreach($_POST as $post => $value){
        echo "$post -> $value <br/>";
    }
}

<form method="post" action="#">
    PHP<input type="checkbox" name="PHP"><br/>
    JS<input type="checkbox" name="JS"><br/>
    JAVA<input type="checkbox" name="JAVA"><br/>
    PYTHON<input type="checkbox" name="PYTHON"><br/>
    <input type="submit" name="submit"/>
</form>

但是之前似乎增加了更多的动态而不那么乏味（我相信）。

关于@ Capsule的问题

alert("val="+$(this).val()+",checked="+$(this).attr('checked'));
<input type="checkbox"> Check me.

返回值on我认为这是复选框的默认值。

第二个实验也给出on值。

我希望我没错。

Answer 4

如果将数组传递给val函数，如果复选框的值与数组中的值匹配，则会将复选框设置为选中。资料来源：http://api.jquery.com/val/#val-value

<input id="checkbox" type="checkbox" value="remember">    

$("#checkbox").val(["remember"]);

Answer 5

复选框的值与文本框一样，只有在提交时选中了复选框，才会在提交表单时将此值发送到服务器。

与文本框不同，复选框的默认值为on - 当选中该复选框但没有自己的value时，会将其发送到服务器，因此处理代码可以知道它被选中了。

因此.val()方法正常工作，返回元素的值。

你是正确的，jQuery缺少简单的方法来查看是否选择了特定的复选框/单选按钮，类似$("#mycheckbox").checked()，但这就是我们的插件。：）

Answer 6

复选框并不总是单独的，并且在提交表单时会传递其值（否则，名称/值根本不会传递）。

从复选框中创建数组非常有用，您可以使用name="test[]"作为名称，并在每个中设置不同的值。解析提交的结果时，最终会得到一个包含所有已检查值的数组

Answer 7

您可以对jquery的val函数进行一些操作以使其表现得像这样。是否返回值attr，返回true或false。

(function (){
    var jval = $.fn.val
    function superval(value){
        if (value === undefined){
            if (this.is("input") && this.attr("type") == "checkbox"){
                if (this.attr("value")===undefined){
                    return this[0].checked
                }
            }
            return jval.call(this)
        } else {
            return jval.call(this, value)
        }
    }
    $.fn.val = superval
})()

console.log($('<input type="checkbox"/>').val()); // false
console.log($('<input type="checkbox" checked="whatever"/>').val()); // true
console.log($('<input type="checkbox" checked="whatever" value="yes"/>').val()); // yes
console.log($('<input type="text" value="heya"/>').val()); // heya

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

jQuery val（）和复选框

7 个答案: