ie6下怪异的radio

首先一句话：查bug的过程是痛苦的，结果是兴奋的。

近来尝试了一下，jquery ui ，其中的 dialog 还算好用，但是仍然在ie6下被我发现了一个bug：

示例

解决方法：只能是先等窗体显示出来后再操作radio了。

抽象如下：

示例

<div id="dialog" title="模板选择" >	
	 <input type="radio" name="template" value="1" />
	 <input type="radio" name="template" value="2" id="testRadio" />
	 <input type="radio" name="template" value="3" /> 
</div>
<script>
$(function(){
	 $("#dialog input:radio").attr("checked", false);
   $("#test").click(function(){
    		$("#dialog input:radio[value=" + "2" + "]").attr("checked", true); 
    		//或者$("#testRadio").appendTo("body");
    		$("#dialog").appendTo("body");
     });
});
</script>

 

根本原因：

当脚本设置了某个radio为checked，再在dom树中移动它的位置，或者其祖先元素的位置(即示例中的：$("#dialog").appendTo("body");)，当前radio在ie6下的checked状态被清除了！而恰恰在 jquery ui dialog 中当设置modal：true，即遮罩时，会在dom树中移动窗体dom节点的位置（who knows why！或许是为了控制reflow的次数 ，先将窗体从dom树中删掉再进行dialog包装，再插入到dom树中，但是display也可以做到的啊），于是产生实示例的效果了。

 

 

 

ps: innerHTML问题

顺带分享一下radio的相关innerhtml操作，ie与其他浏览器的差异，不知道算不算bug，但是也要注意下

radio innerHTML of ie6