jQuery clone()函数搞乱了原始元素的属性

时间:2013-12-18 05:39:13

标签: javascript jquery dom clone

我有这个看似简单的问题。我首先检查一个单选按钮,然后克隆它。原始单选按钮变为未选中状态,克隆的单选按钮正确无误。任何人都可以告诉我为什么原来的单选按钮会被取消选中吗?

提前致谢!

<!DOCTYPE HTML>
<html>
<head>
    <script src="jquery.js"></script>
</head>
<body>
    <div id="ClonedDiv" style="display:none"></div>
    <div id="RadioDiv">
        <input id="high"   type="radio" name="severity" value="High"/>
        <input id="medium" type="radio" name="severity" value="Medium"/>
        <input id="low"    type="radio" name="severity" value="Low"/>
    </div>
    <script>
            $("#RadioDiv #high").prop("checked", true);
            alert("RadioDiv's High is: " + ($("#RadioDiv #high")[0].checked ? "CHECKED." : "NOT CHECKED!") );
            $("#ClonedDiv").empty();
            $("#RadioDiv>input").clone().appendTo("#ClonedDiv"); // I'm merely cloning RadioDiv's inputs into ClonedDiv...
            alert("RadioDiv's High is: " + ($("#RadioDiv #high")[0].checked ? "CHECKED." : "NOT CHECKED!") );
            alert("ClonedDiv's High is: " + ($("#ClonedDiv #high")[0].checked ? "CHECKED." : "NOT CHECKED!") );
    </script>
</body>
</html>

1 个答案:

答案 0 :(得分:4)

只能检查组中的一个单选按钮。检查一个取消检查所有其他人。一组单选按钮由它们确定,它们都具有相同的名称属性。将它们克隆到隐藏的div中,然后检查一个不检查另一个。