通过JS生成表

时间:2015-06-17 07:04:28

标签: javascript html internet-explorer-8

以下代码适用于Google Chrome,但在IE8中无效。它在IE8中提供所有警报但不呈现表格。 有人可以帮忙吗?

<html>

<head>
    <title>Routing</title>
    <script>
    var table;
    var row;
    var col1;
    var col2;
    var i, j, k;
    function getData()
    {
        document.body.style.zoom = "75%";
        table = document.getElementById("mainTable");
        for(k=0; k<3; k++)
        {
            alert("1");
            row = document.createElement('tr');
            if(k%2!==0)
            {
                alert("2");
                str="<td colspan=\"10\"><img src=\"arrow.png\" alt=\"Down Left Arrow\" height=\"42\" width=\"100%\"></td>"
                row.innerHTML=str;
            }
            else
            {
                alert("4");
                for(x = 0; x<10; x+=2)
                {
                    col1 = row.appendChild(document.createElement('td'));
                    col2 = row.appendChild(document.createElement('td'));
                    //Column x
                    str="<table border=\"0\" rules=rows width=\"99%\">";
                    for(y=0; y<5; y++)
                    {
                        str+="<tr><td style=\"background-color : green; color:white; font: 1.0em arial, sans-serif;\" align=\"center\" width=\"80%\">abcd</td></tr>";
                    }
                    str+="<tr>" + "<td width=\"99%\" height=\"99%\" align=\"center\">" + 
                        "<img src=\"ArrowRight.png\" alt=\"Right Arrow\" height=\"42\" width=\"80%\"></td>" + 
                        "</tr></table>";
                    col1.innerHTML=str;

                    //Column x+1
                    str="<table border=\"0\" rules=rows width=\"100%\" style=\"border : 2px solid black\">";
                    for(z=0; z<1; z++)
                    {
                        str+="<tr><td style=\"background-color : blue; color:white; font: 1.0em arial, sans-serif;\" align=\"center\" width=\"99%\" height=\"99%\" >abcd</td></tr>";
                    }       
                    str+="<tr><td style=\"background-color : red; color:white; font: 1.5em arial, sans-serif;\" align=\"center\">" + "Data1" + "</td></tr>" +
                        "<tr><td style=\"background-color : red; color:white; font: 1.5em arial, sans-serif;\" align=\"center\">" + "Data2" + "</td></tr>" +
                        "<tr><td style=\"background-color : red; color:white; font: 1.5em arial, sans-serif;\" align=\"center\">" + "Data3" + "</td></tr></table>";
                    col2.innerHTML=str;     
                }
            }
            alert("6");
            table.appendChild(row);
            alert("7");
        }
    }
    </script>
</head>

<body onload="getData();">
    <table id="mainTable" width="100%" cellspacing="5" cellpadding="10" style="background-color : #DCDCDC; border : 2px solid black">
</body>

</html>

尝试使用两种浏览器运行它,让我知道我正在犯的错误。 感谢

1 个答案:

答案 0 :(得分:1)

Internet Explorer 8及以前版本不支持AFAIK if($this->request->is('post')){ $data = $this->request->data; echo "<pre>",print_r($data),"</pre>"; //You should be able to see file data in this array } ,而是要使用appendChild和createElement。

例如,您可以使用innerHTML代替row.innerHTML=str;

某些功能参考:http://www.w3schools.com/jsref/met_node_appendchild.asp