" id="b1img" alt="米课”N+1“思维建站-非官方免费技术支持,Wordpress/Zencart/Opencart建站、SEO" title="米课”N+1“思维建站-非官方免费技术支持,Wordpress/Zencart/Opencart建站、SEO">
  • " alt="米课”N+1“思维建站-非官方免费技术支持,Wordpress/Zencart/Opencart建站、SEO" title="米课”N+1“思维建站-非官方免费技术支持,Wordpress/Zencart/Opencart建站、SEO" />
  • " alt="Windows/Linux服务器运维技术支持 环境搭建、应用发布、服务器管理、虚拟化、云计算" title="Windows/Linux服务器运维技术支持 环境搭建、应用发布、服务器管理、虚拟化、云计算" />
  • " alt="高校/小型企业网络运维与建设免费技术支持,网络规划、网络优化、故障排除、网络管理" title="高校/小型企业网络运维与建设免费技术支持,网络规划、网络优化、故障排除、网络管理" />

IE 6中使用document.createElement和appendChild无法显示

程序设计2009-03-25 itlogger阅读(1,389) 评论(0)

实现在点击表格自动增加一栏的功能,使用如下函数,发现在IE6下不能显示,而在IE7、IE8等浏览器可以正常实现:

<scrIPt type=”text/javascript”>
var i = 0;
function change(){
i++;
  var  tb=document.getElementById(“t1”)
  var txt = document.createElement(“input”);
  var tr1 = document.createElement(“tr”);
var td1= document.createElement(“td”);
var td2= document.createElement(“td”);
td2.setAttribute(“width”,”123″)
td2.setAttribute(“bordercolor”,”#FFFFFF”)
td2.setAttribute(“bgcolor”,”#CAE2EB”)

  td1.setAttribute(“width”,”401″)
  td1.setAttribute(“align”,”left”)
td1.setAttribute(“bordercolor”,”#FFFFFF”)
td1.setAttribute(“bgcolor”,”#FFFFFF”)
td1.innerHTML=”phone”+i+”1″;
td2.innerHTML=”电话号码”+i+”1″;
  txt.setAttribute(“name”,”phone”+i+”1″);
  txt.setAttribute(“type”,”text”);
 txt.setAttribute(“size”,”15″);
 txt.setAttribute(“maxlength”,”15″);
 
 td2.appendChild(td2);
 tr1.appendChild(td2);
 tr1.appendChild(td1);

td1.appendChild(txt);
‘tb.appendChild(tr1);
tb.appendChild(tr1);
}
</script>

问题IE6对appendChild的函数不支持,

IE6 增加TR用 TABLEOBJ.insertRow() 
        增加TD用 TROBJ.insertCell()

参考IE6可正常执行的代码:

<script>
var j=0
function add_row(){
    k=j+1
    j=sqd.rows.length;
    newRow=document.all.sqd.insertRow(-1)
    newcell=newRow.insertCell()
    newcell.style.backgroundColor=’#f7f7f7′
    newcell.innerHTML=j
    newcell=newRow.insertCell()
    newcell.style.backgroundColor=’#f7f7f7′
    newcell.innerHTML=”<input name=Number type=radio >”
    newcell=newRow.insertCell()
    newcell.style.backgroundColor=’#f7f7f7′
    newcell.innerHTML=”<input name=SerialNumber type=text class=INPUT1 size=3>”
    newcell=newRow.insertCell()
    newcell.style.backgroundColor=’#f7f7f7′
    newcell.innerHTML=”<input name=ProductName type=text class=INPUT1 size=3>”
    newcell=newRow.insertCell()
    newcell.style.backgroundColor=’#f7f7f7′
    newcell.innerHTML=”<input name=PieceNo type=text class=INPUT1 size=3>”
    newcell=newRow.insertCell()
    newcell.style.backgroundColor=’#f7f7f7′
    newcell.innerHTML=”<input name=Quantity type=text class=INPUT1 size=3>”
    newcell=newRow.insertCell()
    newcell.style.backgroundColor=’#f7f7f7′
    newcell.innerHTML=”<input name=GrossWeight type=text class=INPUT1 size=3>”
    newcell=newRow.insertCell()
    newcell.style.backgroundColor=’#f7f7f7′
    newcell.innerHTML=”<input name=CountWeight type=text class=INPUT1 size=3>”
    newcell=newRow.insertCell()
    newcell.style.backgroundColor=’#f7f7f7′
    newcell.innerHTML=”<input name=UnitPrice type=text class=INPUT1 size=3>”
    newcell=newRow.insertCell()
    newcell.style.backgroundColor=’#f7f7f7′
    newcell.innerHTML=”<input name=Amount type=text class=INPUT1 size=3>”
    newcell=newRow.insertCell()
    newcell.style.backgroundColor=’#f7f7f7′
    newcell.innerHTML=”<input name=CustOrder type=text class=INPUT1 size=3>”
    newcell=newRow.insertCell()
    newcell.style.backgroundColor=’#f7f7f7′
    newcell.innerHTML=”<input name=Description type=text class=INPUT1 size=3>”
}
function del_row() {
    if(sqd.rows.length==1) return;
    var checkit = false
    for (var i=0;i<document.all.Number.length;i++) {
            if (document.all.Number[i].checked) {
            checkit=true;
            sqd.deleteRow(i)
            break;
            }
    }
    if (checkit) {
        for(i=1;i<sqd.rows.length;i++){
        sqd.rows[i].cells[0].innerText=i
    }

    } else
    {
    alert(“请选择一个要删除的对象”);
    return false}
}
</script><table width=90% border=0 align=”center” cellpadding=2 cellspacing=1 bgcolor=”#FFFFFF”>
  <tr>
    <td height=”25″ class=”table1″>
      <div align=”center”><font color=”#FFFFFF”><strong>≡≡≡ 货 运 单 概 要 ≡≡≡</strong></font></div></td>
  </tr>
  <tr>
    <td align=center valign=top bgcolor=f7f7f7><table id=”sqd” width=”90%” border=”0″ cellpadding=”0″ cellspacing=”1″ bgcolor=”#999999″>
        <tr bgcolor=”#BAC2DA”>
          <td height=”25″>
            <div align=”center”>序号</div></td>
          <td>
            <div align=”center”>选中
                <input name=Number type=hidden >
          </div></td>
          <td>
            <div align=”center”>货物编号</div></td>
          <td>
            <div align=”center”>货物品名</div></td>
          <td>
            <div align=”center”>件数</div></td>
          <td>
            <div align=”center”>数量</div></td>
          <td>
            <div align=”center”>毛重</div></td>
          <td>
            <div align=”center”>计货重量</div></td>
          <td>
            <div align=”center”>费率</div></td>
          <td>
            <div align=”center”>金额</div></td>
          <td>
            <div align=”center”>客户定单号</div></td>
          <td>
            <div align=”center”>备注</div></td>
        </tr>
      </table>
        <br>
        <input name=”Submit5″ type=”button” onClick=add_row() class=”button” value=” 添 加 “>
        <input name=”Submit33″ onclick=del_row() type=”button” class=”button” value=” 删 除 “>
    </td>
  </tr>
</table>

转载请注明 :IT樵客
文章地址:http://www.itlogger.com/program/640.html
标签:,
相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注