0

这是一个示例代码。

如果我们有 100 个选项，例如，用户选择一个选项，它会显示相应的描述。

我使它与 Jscript 一起工作，但那太长的代码乱七八糟的。而且很简单

这是 JS 版本：http: //jsfiddle.net/eHwVn/

我想使用简单的 HTML

<select>
  <option value="i">ItemA</option>
  <option value="i">ItemB</option>
  <option value="i">ItemC</option>
  <option value="i">ItemD</option>
  <option value="i">ItemE</option>
  <option value="i">ItemF</option>
</select>

如何使用 HTML 为每个项目添加描述？

得到这个：

（抱歉我还不能发布图片） http://i.stack.imgur.com/DSm4j.png

感谢帮助

和平！

4

1 回答 1

0

试试下面的 JSFiddle：http: //jsfiddle.net/3XTjH/

使用 HTML：

<select id="example" onchange="showtext()">
    <option value="http://www.cnet.com" data_info="Click here for Cnet, the primer technology site on the net!">Cnet</option>
    <option value="http://www.cnn.com" data_info="Click here for CNN, one of the best sources online to get your news.">CNN</option>
    <option value="http://www.geocities.com" data_info="Click here for Geocities, and receive 10 megs of free web space.">Geocities</option>
</select>
<br>
<textarea rows=5 cols=21 wrap="virtual" id="text"></textarea>

和 Javascript ：

function showtext() {
    var dropdown = document.getElementById("example");
    var curOption = dropdown.options[dropdown.selectedIndex];

    var info = curOption.getAttribute('data_info');

    var txt = document.getElementById('text');

    txt.value = info;
}

每次选择一个新选项时，它都会找到当前选择的选项，然后找到该data_info选项的属性值并将文本区域的值设置为它。

于 2013-10-01T15:23:55.450 回答