Я создаю новую таблицу с Javascript, которая содержит строку с набором полей, элементом ввода, изображением и элементом сценария.Он отлично работает в FF, Chrome, Safari, но не в Internet Explorer.Таблица отображается, но что-то не так с тегами input, img или script в IE, я полагаю.Любая помощь приветствуется.
var fSetTbl = document.createElement("table");
var fSetTblBody = document.createElement("tbody");
///////////first row
var row1 = document.createElement("tr");
var cell1 = document.createElement("td");
(navigator.appName == "Microsoft Internet Explorer") ? cell1.setAttribute("className", "keyNested2") : cell1.setAttribute("class", "keyNested2");
var label1 = document.createElement("label");
label1.setAttribute("for", startFieldName);
label1.innerHTML = "Start Date/Time";
cell1.appendChild(label1);
var cell2 = document.createElement("td");
var element = document.createElement("input");
(navigator.appName == "Microsoft Internet Explorer") ? element.setAttribute("className", "inputboxdateNested") : element.setAttribute("class", "inputboxdateNested");
element.setAttribute("type", "text");
element.setAttribute("name", startFieldName);
element.setAttribute("id", startFieldName);
element.setAttribute("value", modifiedDate);
element.setAttribute("size", "40");
element.setAttribute("onblur","isDate(this.value,'"+startFieldName+"')");
cell2.appendChild(element);
var img = document.createElement("img");
img.src = "../images/icons/date.png";
img.setAttribute("id",startFieldButton);
//img.align = "absmiddle"; //works
img.setAttribute("align","absmiddle"); //works
img.setAttribute("border","0");
img.style.cursor = "pointer";
img.setAttribute ("onmouseover","this.style.background='black'");
img.setAttribute ("onmouseout","this.style.background=''");
cell2.appendChild(img);
var calScript = document.createElement("script");
calScript.language = "JavaScript";
calScript.type = "text/javascript";
//calScript.setAttribute('type','text/javascript');
var calCode = getCalCode(startFieldName,startFieldButton,modifiedDate,dateTimeFormat,showTime,timeType);
var scriptText = document.createTextNode(calCode);
(navigator.appName == "Microsoft Internet Explorer") ? calScript.text = calCode : calScript.appendChild(scriptText);
cell2.appendChild(calScript);
row1.appendChild(cell1);
row1.appendChild(cell2);
fSetTblBody.appendChild(row1);
////////////second row
var row2 = document.createElement("tr");
cell1 = document.createElement("td");
(navigator.appName == "Microsoft Internet Explorer") ? cell1.setAttribute("className", "keyNested2") : cell1.setAttribute("class", "keyNested2");
label1 = document.createElement("label");
label1.setAttribute("for", endFieldName);
label1.innerHTML = "End Date/Time";
cell1.appendChild(label1);
cell2 = document.createElement("td");
element = document.createElement("input");
(navigator.appName == "Microsoft Internet Explorer") ? element.setAttribute("className", "inputboxdateNested") : element.setAttribute("class", "inputboxdateNested");
element.setAttribute("type", "text");
element.setAttribute("name", endFieldName);
element.setAttribute("id", endFieldName);
element.setAttribute("value", modifiedDate);
element.setAttribute("size", "40");
element.setAttribute("onblur","isDate(this.value,'"+endFieldName+"')");
cell2.appendChild(element);
img = document.createElement("img");
img.src = "../images/icons/date.png";
img.setAttribute("id",endFieldButton);
//img.align = "absmiddle"; //works
img.setAttribute("align","absmiddle"); //works
img.setAttribute("border","0");
img.style.cursor = "pointer";
img.setAttribute ("onmouseover","this.style.background='black'");
img.setAttribute ("onmouseout","this.style.background=''");
cell2.appendChild(img);
calScript = document.createElement("script");
calScript.language = "JavaScript";
calScript.type = "text/javascript";
var calCode = getCalCode(endFieldName,endFieldButton,modifiedDate,dateTimeFormat,showTime,timeType);
var scriptText = document.createTextNode(calCode);
(navigator.appName == "Microsoft Internet Explorer") ? calScript.text = calCode : calScript.appendChild(scriptText);
cell2.appendChild(calScript);
row2.appendChild(cell1);
row2.appendChild(cell2);
fSetTblBody.appendChild(row2);
fSetTbl.appendChild(fSetTblBody);
(navigator.appName == "Microsoft Internet Explorer") ? fSetTbl.setAttribute("className", "skTable") : fSetTbl.setAttribute("class", "skTable");
fSetTbl.setAttribute("cellPadding","0");
fSetTbl.setAttribute("cellSpacing","1");
fSet.appendChild(fSetTbl);
tblBody.appendChild(mainRow);
Ниже приведено то, что он генерирует в IE 8.
<TR><TD>
<FIELDSET class=popupFormNested><LEGEND class=grey-black>New Entry 1</LEGEND>
<TABLE class=skTable cellSpacing=1 cellPadding=0>
<TBODY>
<TR>
<TD class=keyNested2><LABEL for="dueDate_1">Start Date/Time</LABEL></TD>
<TD>
<INPUT onblur="isDate(this.value,'dueDate_1')" id=dueDate_1 class=inputboxdateNested value="01-05-2012 08:00 PM" size=40>
<IMG style="CURSOR: pointer" id=dueDateButton_1 onmouseover="this.style.background='black'" onmouseout="this.style.background=''" border=0 align=absMiddle src="../images/icons/date.png" width=16 height=16>
<SCRIPT language=JavaScript type=text/javascript>Calendar.setup({ trigger : "dueDateButton_1", inputField : "dueDate_1", dateFormat : "%m-%d-%Y %I:%M %p", showTime : 12, fdow : 0, selectionType : Calendar.SEL_SINGLE, selection : "01-05-2012 08:00 PM", animated : true, align : "Bl/ / / / ", onTimeChange : function() { var date = this.selection.get(); date = Calendar.intToDate(date); date = Calendar.printDate(date, "%m-%d-%Y"); var h = this.getHours(), m = this.getMinutes(), aorp = "AM", t = ""; var timeType = "civilian"; if (timeType == "civilian") { if (h > 11) aorp = "PM"; if (h == 0) h = 12; if (h > 12) h = h - 12; if (h < 10) h = "0" + h; if (m < 10) m = "0" + m; t = h + ":" + m + " " + aorp; } else { if (h < 10) h = "0" + h; if (m < 10) m = "0" + m; t = h + ":" + m; } date = date + " " + t; document.getElementById("dueDate_1").value = date; } }); </SCRIPT>
</TD></TR>