jQuery复选框始终返回'undefined'

时间:2011-12-16 22:57:14

标签: jquery

信息:jQuery 1.6.0 HTML复选框:

首先,我确保jQuery已加载:

if(jQuery) {
    alert("loaded");
}

就是这样,它已经加载了。 然后在我使用之后立即行:

var returnvalue = jQuery("#mycheckbox").attr("checked");
alert(returnvalue);

由于某种原因,这始终警告“未定义”。我100%确定ID存在。我也尝试过以下方法:

jQuery("#mycheckbox").find('input[type="checkbox"]').each(function(){
    alert("foo");
    if (jQuery(this).is(":checked")) 
        ReturnVal = true;
});

但这甚至没有弹出警报。

我做错了什么?我到目前为止是一个jQuery或Javascript专家,但这应该工作......对吗?

编辑: 我试过了:

jQuery(document).ready(function() {
    alert(id);
    var returnvalue = jQuery("#" . id).prop("checked");
    alert(returnvalue);
});

alert(id)为我提供了正确的ID,但alert(returnvalue)返回undefined。

我也试过了:

if(jQuery) { 
    alert("loaded");
} 
jQuery(function() {
    alert(id);
    var returnvalue = jQuery("#" . id).attr("checked");
    alert(returnvalue);
});

相同的结果

EDIT2: 使用.prop后,用“+”而不是“。”附加id。 (PHP习惯),它的工作原理。谢谢大家的帮助!

3 个答案:

答案 0 :(得分:15)

  • 如果您使用的是jQuery 1.6或更高版本,请使用prop()代替attr()

var returnvalue = jQuery("#mycheckbox").prop("checked");

这是因为如果您没有在元素中包含显式checked属性,那么该属性为undefined,但该属性将具有默认属性。


  • 您需要删除.find()
jQuery("#mycheckbox").each(function(){
    alert("foo");
    if (jQuery(this).is(":checked")) 
        ReturnVal = true;
});

在问题中包含您的HTML会很有帮助。

答案 1 :(得分:4)

试试这个:

if(jQuery) {
    alert("loaded");
}
$(function() {
    var returnvalue = $("#mycheckbox").attr("checked");
    alert(returnvalue);
});

<强>更新

如果您的脚本位于页面顶部,则会在加载HTML之前执行。在此期间,attr('checked')未定义。

通过将代码包装在自执行的匿名函数$(function(){...})中,您的代码在HTML加载后执行。

回答评论

您的代码:

function isChecked(id)
{
    if(jQuery) { alert("loaded"); } 
    $(function() {
        alert(id);
        var returnvalue = $("#" + id).attr("checked"); 
        alert(returnvalue); 
    });
}

试试这个。什么警报?

function isChecked(id)
{
    if(jQuery) { alert("loaded"); } 
    alert(id);
    alert('there are this many elements with matching id: ' + $("#" . id).length);
    var returnvalue = $("#" + id).attr("checked"); 
    alert(returnvalue); 
}

第三个警报是否说“有这么多元素匹配id:0”?

答案 2 :(得分:2)

使用.prop $('#checkbox1').prop('checked'),jQuery 1.6 +

关于布尔属性,请考虑由HTML标记<input type="checkbox" checked="checked" />定义的DOM元素,并假设它位于名为elem的JavaScript变量中:

elem.checked    true (Boolean) Will change with checkbox state
$(elem).prop("checked") true (Boolean) Will change with checkbox state
elem.getAttribute("checked")    "checked" (String) Initial state of the checkbox; does not change
$(elem).attr("checked")(1.6)    "checked" (String) Initial state of the checkbox; does not change
$(elem).attr("checked")(1.6.1+) "checked" (String) Will change with checkbox state
$(elem).attr("checked")(pre-1.6)    true (Boolean) Changed with checkbox state

根据W3C表单规范,checked属性是布尔属性,这意味着如果属性完全存在则相应的属性为true - 例如,即使属性没有值或空字符串值。确定是否选中复选框的首选跨浏览器兼容方法是使用以下方法之一检查元素属性上的“truthy”值:

if ( elem.checked )
if ( $(elem).prop("checked") )
if ( $(elem).is(":checked") )

如果使用jQuery 1.6,代码if ( $(elem).attr("checked") )将检索实际内容属性,该属性在选中和取消选中复选框时不会更改。它仅用于存储checked属性的默认值或初始值。为了保持向后兼容性,jQuery 1.6.1+中的.attr()方法将为您检索和更新属性,因此不需要将布尔属性的代码更改为.prop()。然而,检索已检查值的首选方法是使用上面列出的选项之一。要查看最新jQuery中的工作方式,请选中/取消选中下面示例中的复选框。