Question

我用下拉菜单制作了一张桌子。

<tr>
    <td>items</td>
    <td><select id="afewitems">
        <option value="0">Select</option>
        <option value="1">item1</option>
        <option value="2">item2</option>
    </td></select>
</tr>

使用javascript（不是jQuery）我想根据选择在屏幕上动态加载项目。示例：当我选择item1（值=“1”）时，我希望根据选择在网页上加载额外信息。（文字和/或图像）

我在网站上发现了这个： Adding additional data to select options using jQuery http://jsfiddle.net/GsdCj/2/

所以我的问题是：如何根据选择ID /值加载Java中的预写信息？

Answer 1

使用onchange HTML <select>属性。

<select id="afewitems" onchange="changeInfo(this)">
<!--  (option tags) -->
<div id="info"></div>

JavaScript的：

function changeInfo(el) {
    var info = [ 
        "some text",       // option 0
        "something else",  // option 1
        "..."              // option 2
    ];
    var val = el.options[el.selectedIndex].value;
    document.getElementById('info').innerHTML = info[val];
}

<强> jsFiddle

以下是对多个<select>代码的修改。

jsFiddle

Javascript选择值加载

1 个答案: