在各種javascript元素上的跨瀏覽器兼容性

我正在研究使瀏覽器兼容的應用程序。我有一個jsp頁面，它將調用執行的Javascript函數。基本上，我在頁面中顯示內容列表以供選擇無線電button.Here它去在各種javascript元素上的跨瀏覽器兼容性

JSP頁面：

<script language="JavaScript"> 
     loadcodes(10,'codesTable','#TheCodes',' ' ,'desc','<%=compositeDescTagName%>','<%=compositeDescFormName%>','<%=codeFormName%>','<%=codeIdFormName%>','document.resourceform.<%=Globals.ENFORCE_COMMENTS%>'); 
    </script>.

上述功能將參照下面的JS網頁

function loadcodes(depth,tableId,dataSrc,onclickfunc,descFld,compositeDescTagName,compositeDescFormName,codeFormName,codeIdFormName,enforceCommentsFormName) 
{ 
    document.writeln("<TABLE height=100% id=PrimaryTable dataSrc='" + dataSrc + "' cellSpacing=0 cellPadding=0 border=0> <TBODY>"); 
    writeNode(depth,dataSrc,descFld,compositeDescTagName,compositeDescFormName,codeFormName,codeIdFormName,enforceCommentsFormName); 
    document.writeln("</TBODY></TABLE>"); 
} 

function writeNode(depth,dataSrc,descFld,compositeDescTagName,compositeDescFormName,codeFormName,codeIdFormName,enforceCommentsFormName) 
{ 
    if (depth <= 0) 
     return; 
    document.writeln("<TR onclick=\"toggle(this,'" + dataSrc + "','" + compositeDescTagName + "','" + compositeDescFormName + "','" + codeFormName + "','" + codeIdFormName + "','" + enforceCommentsFormName + "')\" class=tree_indent>"); 
     document.writeln("<TD><IMG dataFld='image' id=Icon class=tree_node>"); 
    document.writeln("<SPAN dataFld=" + descFld + " class=formtext></SPAN>"); 
    document.writeln("<SPAN dataFld=haschildren id=HasChildren style='DISPLAY:none'></SPAN><SPAN dataFld=isleaf id=isleaf style='DISPLAY: none'></SPAN><SPAN dataFld=composite_desc id=composite_desc style='DISPLAY:none'></SPAN>"); 
    document.writeln("<SPAN dataFld=composite_code id=composite_code style='DISPLAY:none'></SPAN>"); 
    document.writeln("<SPAN dataFld=composite_id id=composite_id style='DISPLAY:none'></SPAN>"); 
    document.writeln("<SPAN dataFld=comments_required id=comments_required style='DISPLAY:none'></SPAN>"); 
    document.writeln("</TD></TR>"); 
    document.writeln("<TR style='DISPLAY: none' class=tree_indent>"); 
     document.writeln("<TD><!-- next level -->"); 
     document.writeln("<TABLE class=tree_node id=node dataFld=node valign=top border=0 cellSpacing=1 cellPadding=1 >"); 
     document.writeln("<TBODY>"); 
    writeNode(--depth,dataSrc,descFld,compositeDescTagName,compositeDescFormName,codeFormName,codeIdFormName,enforceCommentsFormName); 
     document.writeln("</TBODY>"); 
     document.writeln("</TABLE>"); 
     document.writeln("</TD>"); 
     document.writeln("</TR>"); 
} 

var selectedCode; 
function toggle(e,dataSrc,compositeDescTagName,compositeDescFormName,codeFormName,codeIdFormName,enforceCommentsFormName) 
{ 
    var nextRow; 
    var nextRow1; 

    nextRow = e.nextSibling; 

    hc = e.all.HasChildren; 
    var isleaf = e.all.isleaf; 

    if (nextRow.style.display == "none" && isleaf.innerText == "false") 
    { 
     nextRow.style.display = ""; 
     e.all.Icon.src = "/edcs/images/minus.gif"; 

     if (nextRow.all && nextRow.all[2] && !nextRow.all[2].dataSrc) 
     { 
      nextRow.all[2].dataSrc = dataSrc; 
     } 
    } 
    else if (isleaf.innerText == "true") 
    { 
     // reset the bullet on the one already selected 
     if (selectedCode && selectedCode.all && selectedCode.all.Icon) 
      selectedCode.all.Icon.src = "/edcs/images/bullet.gif"; 

     e.all.Icon.src = "/edcs/images/right.gif"; 

     re=/'/g; 

     var str = e.all.composite_desc.innerText.replace(re,"\\'"); 

     eval(compositeDescTagName + ".innerText = '" + str + "'"); 
     eval(compositeDescFormName + ".value = '" + str + "'"); 
     eval(codeFormName + ".value = '" + e.all.composite_code.innerText + "'"); 
     eval(codeIdFormName + ".value = '" + e.all.composite_id.innerText + "'"); 
     commentsEnforced = eval(enforceCommentsFormName + ".value"); 
     if (commentsEnforced == "false") 
      eval(enforceCommentsFormName + ".value = '" + e.all.comments_required.innerText + "'"); 

     selectedCode = e; 
    } 
    else 
    { 
     nextRow.style.display = "none"; 
     e.all.Icon.src = "/edcs/images/plus.gif"; 
    } 
}

此流程在IE瀏覽器中運行良好，但不受其他瀏覽器支持。在搜索時，我發現僅支持IE瀏覽器的元素列表：1.DataSrc 2.Datafld &也是IMG數據庫。

是否有任何替代上述元素與瀏覽器或如何在代碼中進行的修改，以便它是瀏覽器compatbile.Kindly幫助，它也將成爲跨瀏覽器測試模板...謝謝很多

來源

2011-12-21 jaggs

跨瀏覽器的兼容性是使用庫如jQuery，MooTools的核心優勢之一，等等

我建議這些如果一個跨瀏覽器的兼容性是你的目標 - 因爲有整個團隊正在從事這些項目。

來源

2011-12-21 07:40:40 isNaN1247

非常感謝您的答覆。我會嘗試使用jQuery ... – jaggs 2011-12-21 07:49:05

沒問題，請注意，如果這確實有幫助，請將此標記爲答案 – isNaN1247 2011-12-21 07:52:07

首先用document.getElementById替換「all」和「eval」的用法。

所有的瀏覽器都支持大量的調試工具（即FireBug for Firefox） - 用它們來查看失敗的原因。

來源

2011-12-21 07:45:25

在各種javascript元素上的跨瀏覽器兼容性

回答

相關問題