.attr('checked','checked')不起作用 [英] .attr('checked','checked') does not work

查看:65
本文介绍了.attr('checked','checked')不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试检查收音机.以下两种方法均无效:

$('selector').attr('checked','checked');
$('selector').attr('checked',true);

以下代码中的两个alert()分别显示"1"和"a".我的期望是第二个alert()显示"b".

Opera确实在浏览器中选中了第二个单选框,但是其元素检查器Dragonfly显示DOM并未更改.

[结束编辑]

在发布此问题之前,我已经阅读了常见问题解答:

http://docs.jquery.com/Frequently_Asked_Questions#How_do_I_check.2Funcheck_a_radius_a_checkbox_input >

我们将不胜感激!

TIA

xhtml页面和代码如下:

<!DOCTYPE html 
     PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Weird Behavior</title>
<script type="text/javascript" src="scripts/jquery.js"/>
<script type="text/javascript">
function clickme(){
    alert($('input[name="myname"][value="b"]').length);
    $('input[name="myname"][value="b"]').attr('checked','checked');
    $('#b').attr('checked',true);
    alert($('input[name="myname"][checked]').val());
};
</script>
</head>
<body>
    <form action="">
        <fieldset>
            <legend>Why check is not switched?</legend>
            <input type="radio" name="myname" value="a" id="a" checked="checked"/>A
            <input type="radio" name="myname" value="b" id="b"/>B
        </fieldset>
    </form>
    <p>
    <button type="button" onclick="clickme()">click me</button>
    </p>
</body>
</html>

解决方案

使用jQuery,切勿使用内联onclick javascript.保持它不显眼.改为执行此操作,然后完全删除onclick.

此外,请注意在最后一行使用:checked伪选择器.这样做的原因是,一旦页面被加载,html和form元素的实际状态可能会有所不同.打开一个Web检查器,您可以单击另一个单选按钮,HTML仍将显示第一个被选中. :checked选择器会过滤实际检查的元素,而不管html的开头是什么.

$('button').click(function() {
    alert($('input[name="myname"][value="b"]').length);
    $('input[name="myname"][value="b"]').attr('checked','checked');
    $('#b').attr('checked',true);
    alert($('input[name="myname"]:checked').val());
});

http://jsfiddle.net/uL545/1/

I am trying to check radio. Neither the following works:

[edit]

$('selector').attr('checked','checked');
$('selector').attr('checked',true);

The two alert() in the following code show "1" and "a", respectively. My expectation is the second alert() showing "b".

Opera does check the second radio box in its browser, but its element inspector, dragonfly, shows that the DOM is not changed.

[end edit]

I had read the FAQ before I posted this question:

http://docs.jquery.com/Frequently_Asked_Questions#How_do_I_check.2Funcheck_a_checkbox_input_or_radio_button.3F

Helps will be much appreciated!

TIA

The xhtml page and code follows:

<!DOCTYPE html 
     PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Weird Behavior</title>
<script type="text/javascript" src="scripts/jquery.js"/>
<script type="text/javascript">
function clickme(){
    alert($('input[name="myname"][value="b"]').length);
    $('input[name="myname"][value="b"]').attr('checked','checked');
    $('#b').attr('checked',true);
    alert($('input[name="myname"][checked]').val());
};
</script>
</head>
<body>
    <form action="">
        <fieldset>
            <legend>Why check is not switched?</legend>
            <input type="radio" name="myname" value="a" id="a" checked="checked"/>A
            <input type="radio" name="myname" value="b" id="b"/>B
        </fieldset>
    </form>
    <p>
    <button type="button" onclick="clickme()">click me</button>
    </p>
</body>
</html>

解决方案

With jQuery, never use inline onclick javascript. Keep it unobtrusive. Do this instead, and remove the onclick completely.

Also, note the use of the :checked pseudo selector in the last line. The reason for this is because once the page is loaded, the html and the actual state of the form element can be different. Open a web inspector and you can click on the other radio button and the HTML will still show the first one is checked. The :checked selector instead filters elements that are actually checked, regardless of what the html started as.

$('button').click(function() {
    alert($('input[name="myname"][value="b"]').length);
    $('input[name="myname"][value="b"]').attr('checked','checked');
    $('#b').attr('checked',true);
    alert($('input[name="myname"]:checked').val());
});

http://jsfiddle.net/uL545/1/

这篇关于.attr('checked','checked')不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆