2

我想做的是创建2个select语句,当第一个选择了一个选项以使用“onChange”事件来更改第二个select语句的选项时。

这是我想要的一个很好的演示:http: //www.w3.org/TR/WCAG20-TECHS/working-examples/SCR19/dynselect.html

以及对应的代码: http ://www.w3.org/TR/WCAG20-TECHS/SCR19.html

但是,与其使用数组来填充 select 语句中的选项,我更愿意解析 XML 文档中的数据。

XML Doc 类似于:

<inventory>
  <shoes>
    <item>
      <name>Chuck Taylor Converse</name>
      <size>11</size>
      <quantity>2</quantity>
    </item>
  </shoes>
</inventory>

我一直在想的是使用 XSL for-each 语句和 Javascript 函数来更改第二个 select 语句的选项。

//  Shows the name of each type of product from the XML doc
<select id="type" onchange="showProducts(this);">
  <xsl:for-each select="inventory/*">
    <option><xsl:value-of select="name(.)"/></option>
  </xsl:for-each>    
</select>

<select id="product">
</select>

我坚持的是试图弄清楚如何在 Javascript 中实现这一点。我需要将 XML 解析为数组吗?我的另一个想法是尝试使用 XSL 语句执行 document.write,但我无法让它工作。

有任何想法吗?

4

1 回答 1

0

您可以应用 XSLT 服务器端 - 这意味着 JavaScript 将接收可以直接插入页面的 HTML 片段 - 使用 jQuery:

$('#product').load('mysever/url_returning_the_html');

或者服务器可以提供原始 XML,然后您使用 JavaScript 应用 XSLT - 如何执行此操作取决于浏览器,请参阅http://www.w3schools.com/xsl/xsl_client.asp示例。

我的建议是尽可能多地在服务器端进行转换,并向 JavaAcript 代码提供 HTML(可以直接使用)或 JSON(更紧凑且易于在 JavaScript 中解析)。

于 2012-04-21T11:47:22.380 回答