html的checkbox在ie与ff中的差异

突然发现，在IE中取包含有checkbox的标签的innerHTML时，IE会记录checkbox的checked状态，而FF则不会。这样会导致拿着取出的innerHTML给别的标签赋值时，在FF中无法显示出checkbox的当前的选中状态。FF中的该BUG可有解？？？

解决方案 »

  1.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
      
    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head>  
        <title>jquery事件2</title>  
      
        <mce:script src="../脚本/jquery-1.3.2.min.js" mce_src="脚本/jquery-1.3.2.min.js" type="text/javascript"></mce:script>  
        <mce:script type="text/javascript"><!--   
        $(function(){   
        var v;   
        //全选   
        $("#Button1").bind("click",function(){   
          $("[name=item]:checkbox").attr("checked",true);   
        });   
        //反选   
        $("#Button2").bind("click",function(){   
          $("[name=item]:checkbox").attr("checked",false);   
        });   
        //   
        $("#Button3").bind("click",function(){   
          $("[name=item]:checkbox").each(function(){   
            this.checked=!this.checked;   
          })   
        });   
        var str="您最喜欢的运动是:";   
          $("#Button4").bind("click",function(){   
            $("[name=item]:checkbox:checked").each(function(){   
                   str+=$(this).val()+","   
                   
            })   
               alert(str);   
          })   
      
        })   
           
    // --></mce:script>  
    </head>  
    <body>  
    <div id="show">  
    <div>你最喜欢的体育运动是?</div>  
    <div>你的姓名:<input id="Text1" type="text" /></div>  
    <div id="title"><input id="Checkbox1" name="item" type="checkbox" value="足球" />足球   
         <input id="Checkbox2" name="item"  type="checkbox" value="篮球" />篮球   
         <input id="Checkbox3" name="item"  type="checkbox" value="兵乓球" />兵乓球   
         <input id="Checkbox4" name="item"  type="checkbox" value="游泳" />游泳   
         </div>  
      <div id="content">  
      <input id="Button1" type="button" value="全选" />  
        <input id="Button2" type="button" value="取消反选" /></div>  
        <input id="Button3" type="button" value="反选" />  
        <input id="Button4" type="button" value="Click" />  
        </div>  
    </body>  
    </html>  
    本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/ws_hgo/archive/2009/11/04/4768660.aspx
      

  2.   


    /*
      你可以把checkbox做一个循环，拼接成如下的json串。那么无论是 IE 还是 FF 都可以用。
      你在需要填充标签的地方，再用eval('(' + json + ')'); 解释一下，就可以了。
    */
    var json = {'data:[{'value':'1','checked':false},
                       {'value':'2','checked':true},//注意，这里是被选中的项
                       {'value':'3','checked':false}]};=== 结贴，给分 ===
    得到满意的答案，立即结贴给分，是一种良好的习惯和美德
      

  3.   

    好像只能自已写方法，写了一个简单的，你参考一下以下代码会将checkbox连同选中状态复制到另一个对象中.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
     <HEAD>
      <TITLE> New Document </TITLE>
      <script type="text/javascript">
      function copyCheckBox(objid1,objid2){   //将objid1中的所以对象复制到objid2中.
     var obj1=document.getElementById(objid1);
     var obj2=document.getElementById(objid2);
     
     obj2.innerHTML=obj1.innerHTML;
     if(!document.all){  //FF
    var c1=obj1.getElementsByTagName("input");
    var c2=obj2.getElementsByTagName("input");
    for(var i=0,j=c1.length;i<j;i++){
    if(c1[i].type=="checkbox"){
    c2[i].checked=c1[i].checked;
    }
    }
     }
      }  </script>
     </HEAD>
     <BODY>
    <div id="aaa"><input type="checkbox"/><input type="checkbox"/><input type="checkbox"/><input type="input"/></div>
    <div id="bbb"></div>
    <input type="button" value="Copy" ONCLICK="copyCheckBox('aaa','bbb')"/>
     </BODY>
    </HTML>