wrapAll在Internet Explorer 11中取消选中已选中的单选按钮

Question

我有这样的代码：

var root="<div id=\"editorIdPrefix01e36f3a6d53541512468193877\" contenteditable=\"true\"></div>";
var kid = "<div>" + 
  "<input name=\"fieldControlId2\" id=\"fieldId2_1\" type=\"radio\" checked=\"checked\" value=\"1\">" + 
  "<input name=\"fieldControlId2\" id=\"fieldId2_2\" type=\"radio\" value=\"2\">" +
"</div>";
var result = $(kid).wrapAll($(root)).parent();
alert(result.find("input").first().prop("outerHTML"));

注意：在kid变量内有带有checked="checked"输入。 在Internet Explorer 11中，包装后的输入未选中。 知道发生了什么吗（在chrome / ff中可以正常工作）？

JsFiddle链接： https ://jsfiddle.net/svejdo1/81dc0gg4/2/

编辑感谢您的评论，但是通过各种jQuery操作自动创建了checked="checked" （即，如果您使用jquery append <input checked /> append到某些父元素，它将自动更改为checked="checked"

还通过实验将根更改为

var root="<div id=\"editorIdPrefix01e36f3a6d53541512468193877\"></div>";

解决了该问题，因此在这一点上我怀疑是jQuery错误。

Answer 1

原来，这是一个已知的IE 11序列化问题。 这里的示例：

 var root = document.getElementById('editor'); var kid1 = document.getElementById('kid1'); var kid2 = document.getElementById('kid2'); root.appendChild(kid1); root.appendChild(kid2); alert(root.innerHTML); 

 <div id="editor" contenteditable="true" data-ckeditor="true"></div> <div> <input name="fieldControlId2" id="kid1" type="radio" checked="checked" value="1"> <input name="fieldControlId2" id="kid2" type="radio" value="2"> </div> 

解决方案很简单，在操作节点之前运行IE11的fixup：

if (isIe11()) {
  $(kid).find('input[checked="checked"]').each(function() {
    $(this)[0].setAttribute("checked");
  });
}