使用JS脚本操作Table元素,在不同浏览器中操作方法不尽相同。当新建一行之后,IE中可以使用单元格操作来完成单元格的添加,而在FireFox中无法正确通过单元格来操作,而只能使用<td></td>来实现。
因此,在编写填充函数时,要注意检测浏览器并分别处理。
JS代码如下:
//往表格某位置插入行
function insertTableRow(tObj, rowIdx, detail){
if(tObj == null || attendDetail == null) return false;
if(rowIdx < 0 || rowIdx > tObj.rows.length) rowIdx = tObj.rows.length;
var newRow = tObj.insertRow(rowIdx);
newRow.id = detail["id"]; //可选设置
var btype = detectBrower();
if(btype != "IE"){
var rowHTML = "<td>" + detail["code"] + "</td><td>" + detail["name"] + "</td>";
newRow.innerHTML = rowHTML;
}else{
//IE
var c = newRow.insertCell();
c.innerHTML = detail["code"];
c = newRow.insertCell();
c.innerHTML = detail["name"];
}
}
其中,tObj为Table对象,rowIdx为要插入的行位置(从0开始编号),detail为填充对象(具体内容及字段自定)。
函数detectBrower定义如下:
function detectBrower()
{
var sUserAgent = navigator.userAgent;
var isOpera = sUserAgent.indexOf("Opera") > -1;
if(isOpera) return "Opera";
var isKHTML = sUserAgent.indexOf("KHTML") > -1 || sUserAgent.indexOf("Konqueror") > -1 || sUserAgent.indexOf("AppleWebKit") > -1;
var isSafari = sUserAgent.indexOf("AppleWebKit") > -1 && isKHTML;
var isKonq = sUserAgent.indexOf("Konqueror") > -1 && isKHTML;
if(isSafari) return "Safari";
if(isKonq) return "Konqueror";
var isIE = sUserAgent.indexOf("compatible") > -1 && sUserAgent.indexOf("MSIE") > -1 && !isOpera;
if(isIE) return "IE";
var isMoz = sUserAgent.indexOf("Gecko") > -1 && !isKHTML;
if(isMoz) return "Mozilla";
return "None";
}