Question

我确定我会为此失去一些代表点，因为这是一个基本的问题，但是我无法弄清楚我用jQuery选择器做错了用“＃”来选择id

在我的文档中给出了这个元素：

<%= Html.CheckBox("IsAlwaysValid", true,
                    new { onchange = "showHideValidSetList()", id = "IsAlwaysValidCheckBox" })%>

（输出以下标记：

<input checked="checked" id="IsAlwaysValidCheckBox" name="IsAlwaysValid" onchange="showHideValidSetList()" type="checkbox" value="true" /><input name="IsAlwaysValid" type="hidden" value="false" />

）

然后使用jQuery选择器执行此函数：

<script type="text/javascript">
    function showHideValidSetList() {
        if ($("#IsAlwaysValidCheckBox").checked) {
            alert("IsAlwaysValidCheckBox is checked");
            return;
        }
        else {
            alert("IsAlwaysValidCheckBox is NOT checked");
            return;
        }
    }
</script>

应该与使用javascript DOM完全相同：

<script type="text/javascript">
    function showHideValidSetList() {
        if (document.getElementById("IsAlwaysValidCheckBox").checked) {
            alert("IsAlwaysValidCheckBox is checked");
            return;
        }
        else {
            alert("IsAlwaysValidCheckBox is NOT checked");
            return;
        }
    }
</script>

右？但javascript版本按预期工作，而jQuery版本总是采用“else”分支，表明它并没有真正看到复选框的状态。

我做错了什么？

感谢您的支持。

Answer 1

使用此：

if ($(checkBoxControl).attr("checked")) {

而不是：

if ($("#IsAlwaysValidCheckBox").checked) {

虽然看起来jQuery选择器返回DOM元素（如复选框），但它们确实返回了一个jQuery对象，它没有一个名为checked的方法。您可以在未压缩的jquery源代码（来自the current release, version 1.3.2）中清楚地看到这一点：

jQuery.fn = jQuery.prototype = {
    init: function( selector, context ) {
        // ...
        // Handle $(DOMElement)
        if ( selector.nodeType ) {
             this[0] = selector;
             this.length = 1;
             this.context = selector;
             return this;
        }
        // ...
    }
}

许多有趣的jQuery方法（如animate，attr，html等）都在this.context上运行，无论何时应用选择器，都会指定或重新定义。

Answer 2

$("#IsAlwaysValidCheckBox").checked

不正确，因为$("#IsAlwaysValidCheckBox")返回jQuery对象，而不是元素。 jQuery对象没有名为checked的属性，这就是它进入else的原因。

你想要：

$("#IsAlwaysValidCheckBox").val()

或：

$("#IsAlwaysValidCheckBox:checked").length > 0

或：

$("#IsAlwaysValidCheckBox").attr("checked") === "checked"

或：

$("#IsAlwaysValidCheckBox")[0].checked

或：

$("#IsAlwaysValidCheckBox").get(0).checked

Answer 3

您尝试使用

吗？

if ($("#IsAlwaysValidCheckBox").attr("checked")) {

Answer 4

你需要使用它：

$("#IsAlwaysValidCheckBox").attr("checked")

确定是否选中了复选框。

Answer 5

另一种做一件简单事情的方法：

$('#IsAlwaysValidCheckBox:checked').length

选择器：checked是特定于jquery的返回已检查元素。长度检查是否有任何元素返回。

做同样事情的很多方法。

Answer 6

试试这个：

<script type="text/javascript">
    function showHideValidSetList() {
        if ($("#IsAlwaysValidCheckBox").val()) {
            alert("IsAlwaysValidCheckBox is checked");
            return;
        }
        else {
            alert("IsAlwaysValidCheckBox is NOT checked");
            return;
        }
    }
</script>

val方法是一种检查值的“跨元素”方式......无论是文本框，选择列表还是复选框......您可以使用.val（）来获取/设置它的值： - ）

jQuery基本帮助

6 个答案: