Question

我创建了这个测试html页面，允许单个用户向表中添加条目。它在Chrome和Firefox中运行良好。但是当我在IE中尝试它时，它不起作用。我去了控制台，当我尝试添加一行时，它没有给我任何错误。有人可以帮我弄清楚我需要什么来使javascript部分工作？提前谢谢了。这就是我所拥有的

HTML

<!DOCTYPE html>
<html>
    <link rel="stylesheet" href="css/style.css">
    <script src="javascript/script.js"></script>    
    <body>      
        <h1>Hello World</h1>
        <table id="myTable" class="editableTable">
            <caption><center>Table No 1</center></caption>
            <thead> 
                <tr> 
                    <th>ID</th> 
                    <th>Name</th> 
                    <th>Phone</th> 
                    <th>Email</th> 
                    <th>Address</th> 
                </tr> 
            </thead> 
            <tbody id="tablebody"> 
                <tr style="display:none" id="templaterow"> 
                    <td><div contenteditable></div></td> 
                    <td><div contenteditable></div></td> 
                    <td><div contenteditable></div></td> 
                    <td><div contenteditable></div></td> 
                    <td><div contenteditable></div></td>  
                    <td><input type ="image" src="assets/trash.ico" class="deleteIcon" onclick="myDeleteFunction(this)" /></td>                 
                </tr>           
            </tbody>            
        </table>
        <div class="tablebuttons"> <button onclick="myCreateFunction()">Add entry</button></div>        
    </body>
</html>

CSS

body {
    background-color: white;
}

h1 {
    text-align: center;
}

* { 
    font-family:Consolas 
} 

.editableTable { 
    border:solid 1px; 
    width:100%; 
} 

.editableTable td { 
    border:solid 1px; 
} 

.editableTable .cellEditing { 
    padding: 0; 
} 
.editableTable .cellEditing input[type=text]{ 
    width:100%; 
    border:0; 
    background-color:rgb(255,253,210); 
}

.deleteIcon {
    position: relative; 
    left: 25%;
    width: 15px;
    height: 15px;
}

的Javascript

function myCreateFunction() {
    var newInstance = document.getElementById("templaterow").cloneNode(true);
    newInstance.style.display = null;
    newInstance.id = null;

    document.getElementById("tablebody").appendChild(newInstance);
}

function myDeleteFunction(r) {
    var rowCount = myTable.rows.length;
    var i = r.parentNode.parentNode.rowIndex;

    if(rowCount <= 1) return;

    document.getElementById("myTable").deleteRow(i);
}

Answer 1

这对我有用（花了足够长的时间）。

newInstance.style.display = null;

到

newInstance.style.display = "";

将null值更改为""。请参阅Fiddle。

外部javascript文件无法在IE中运行

1 个答案: