代码之家  ›  专栏  ›  技术社区  ›  Ondrej Svejdar

wrapAll取消选中internet explorer 11中的选中单选按钮

  •  0
  • Ondrej Svejdar  · 技术社区  · 8 年前

    我有这样一个代码:

    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"));
    

    注意:有输入 checked="checked" 内部 kid 变量在internet explorer 11中,包装后的输入被取消选中。知道发生了什么吗(在chrome/ff中工作正常)?

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

    编辑 谢谢你的评论,但是 checked=“已检查” 是通过各种jQuery操作自动创建的(例如,如果您使用jQuery append <input checked /> 对于某些父元素,它会自动更改为 checked=“已检查”

    还通过实验将根更改为

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

    修复了这个问题,所以现在我怀疑jQuery有bug。

    1 回复  |  直到 8 年前
        1
  •  0
  •   Ondrej Svejdar    8 年前

    事实证明,这是一个已知的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");
      });
    }