在編寫程序時,Web界面的一部分以XML格式發送到客戶端,並使用Javascript和XSLT轉換爲HTML片段。這在Firefox(4.0b12)和Opera(10.63)中正常工作,但在Chrome(9.0.597.107)中效果並不如預期。Chrome中XSLT的意外結果
的XSLT
<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" indent ="yes"/>
<xsl:template match ="/">
<xsl:for-each select="queue/download">
<xsl:choose>
<xsl:when test="status='downloadError'">
<xsl:variable name="rowClass">ui-state-error</xsl:variable>
<xsl:variable name="iconClass">ui-icon ui-icon-alert</xsl:variable>
<xsl:call-template name="download">
<xsl:with-param name="iconClass" select="$iconClass"/>
<xsl:with-param name="rowClass" select ="$rowClass"/>
</xsl:call-template>
</xsl:when>
<xsl:when test="status='downloadRunning'">
<xsl:variable name="rowClass">ui-state-highlight</xsl:variable>
<xsl:variable name="iconClass">ui-icon ui-icon-refresh</xsl:variable>
<xsl:call-template name="download">
<xsl:with-param name="iconClass" select="$iconClass"/>
<xsl:with-param name="rowClass" select ="$rowClass"/>
</xsl:call-template>
</xsl:when>
<xsl:when test="status='downloadComplete'">
<xsl:variable name="rowClass">downloadComplete</xsl:variable>
<xsl:variable name="iconClass">ui-icon ui-icon-circle-check</xsl:variable>
<xsl:call-template name="download">
<xsl:with-param name="iconClass" select="$iconClass"/>
<xsl:with-param name="rowClass" select ="$rowClass"/>
</xsl:call-template>
</xsl:when>
<xsl:otherwise>
<xsl:variable name="rowClass" select ="status" />
<xsl:variable name="iconClass"/>
<xsl:call-template name="download">
<xsl:with-param name="iconClass" select="$iconClass"/>
<xsl:with-param name="rowClass" select ="$rowClass"/>
</xsl:call-template>
</xsl:otherwise>
</xsl:choose>
</xsl:for-each>
</xsl:template>
<xsl:template name="download">
<xsl:param name="rowClass"/>
<xsl:param name="iconClass" />
<xsl:variable name="id" select ="id"/>
<xsl:variable name="filename" select ="filename"/>
<xsl:variable name="comment" select ="comment"/>
<tr class="{$rowClass}">
<td class="downloadCheck">
<input type="checkbox" class="downloadCheckbox" value="{$id}" name="downloadCheckbox"/>
</td>
<td class="downloadIcon">
<span class="{$iconClass}"></span>
</td>
<td class="downloadName">
<a href="#" onclick="showDownloadCommentBox('{$id}','{$filename}', '{$comment}');">
<xsl:value-of select="filename"/>
</a>
</td>
<xsl:if test="status='downloadError'">
<td class="dError" colspan="4">
<xsl:value-of select ="errortext"/>
</td>
</xsl:if>
<xsl:if test ="status!='downloadError'">
<xsl:variable name="progress" select ="progress"/>
<td class="downloadProgress">
<div class="jqProgress" value="{$progress}"></div>
</td>
<td class="downloadTimeLeft">
<xsl:value-of select ="timeremaining"/>
</td>
<td class="downloadSize">
<xsl:value-of select ="size"/>
</td>
<td class="downloadSpeed">
<xsl:value-of select ="speed"/>
</td>
</xsl:if>
</tr>
</xsl:template>
</xsl:stylesheet>
的XML
<queue>
<name>test</name>
<renderer>downloadQueue</renderer>
<xsl>/xslt/downloadQueue.xslt</xsl>
<status>suspended</status>
<startMode>manual</startMode>
<downloadDirectory>C:\Users\William\Programming\SCRAMDownloader\Trunk\bin\</downloadDirectory>
<download>
<filename>test.zip</filename>
<progress>0.00%</progress>
<speed>-</speed>
<timeremaining>-</timeremaining>
<status>downloadSuspended</status>
<size>119.68 MB</size>
<id>8976170e-1f4b-4b79-8901-5a4191e2c07d</id>
<comment/>
</download>
</queue>
預期結果(火狐)
<tr class="downloadSuspended">
<td class="downloadCheck"><input type="checkbox" class="downloadCheckbox" value="8976170e-1f4b-4b79-8901-5a4191e2c07d" name="downloadCheckbox"></td>
<td class="downloadIcon"><span class=""></span></td>
<td class="downloadName"><a href="#" onclick="showDownloadCommentBox('8976170e-1f4b-4b79-8901-5a4191e2c07d','test.zip', '');">test.zip</a></td>
<td class="downloadProgress"><div class="jqProgress ui-progressbar ui-widget ui-widget-content ui-corner-all" value="0.00%" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0"><div class="ui-progressbar-value ui-widget-header ui-corner-left" style="width: 0%;"></div></div></td>
<td class="downloadTimeLeft">-</td>
<td class="downloadSize">119.68 MB</td>
<td class="downloadSpeed">-</td>
</tr>
結果在Chrome
<input type="checkbox" class="downloadCheckbox" value="8976170e-1f4b-4b79-8901-5a4191e2c07d" name="downloadCheckbox">
<span class=""></span>
<a href="#" onclick="showDownloadCommentBox('8976170e-1f4b-4b79-8901-5a4191e2c07d','test.zip', '');">test.zip</a>
<div class="jqProgress ui-progressbar ui-widget ui-widget-content ui-corner-all" value="0.00%" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0"><div class="ui-progressbar-value ui-widget-header ui-corner-left" style="width: 0%; "></div></div>
-
119.68 MB
-
注意失蹤<tr>
和<td>
標籤
任何想法我做錯了什麼? (很抱歉沒能過長後)
好問題,+1。看到我的回答,確認問題出在google-chrome上 - 而不是用你的代碼。 :) – 2011-03-07 02:05:03