日期:2014-05-18  浏览次数:20409 次

一个DOM的填充问题,大虾来看看~~~
<select   id= "slt_FColor ">
        <option   value= "null "> FColor </option>
</select>
<select   id= "slt_BColor ">
        <option   value= "null "> BColor </option>
</select>
<script   language= "javascript "   type= "text/jscript ">
<!--
        window.onload   =   function(){
             
              var   slt_FColor   =   $( "slt_FColor ");
              var   slt_BColor   =   $( "slt_BColor ");
             
              var   color   =   new   Array( "#000000 ", "#FFFFFF ", "#FF0000 ", "#FFFF00 ", "#00FF00 ", "#00FFFF ", "#0000FF ",
                                                  "#FF00FF ", "#808080 ", "#C0C0C0 ", "#800000 ", "#008000 ", "#008080 ", "#000080 ", "#800080 ");
              for(var   i=0;   i <color.length;   i++){
                      var   option   =   document.createElement( "option ");
                      option.value   =   color[i];
                      option.innerHTML   =   color[i];
                      option.style.background   =     color[i];
                      slt_FColor.appendChild(option);
                      slt_BColor.appendChild(option);
              }
        }
       
        function   $(id){
                return   document.getElementById(id);
        }
-->
</script>

为何填充只对后面的下拉框有作用,而第一个却未填充呢???

------解决方案--------------------
slt_FColor.appendChild(option);

slt_BColor.appendChild(option.cloneNode(true));