[英]External javascript file not working in IE
我创建了这个测试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);
}
这对我有用(花了足够长的时间)。
newInstance.style.display = null;
至
newInstance.style.display = "";
将null
值更改为""
。 参见小提琴 。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.