在javascript中动态更新内容

时间:2012-08-14 13:24:18

标签: javascript html

我想了解一下这个怎么样。基本上,我将创建两个下拉列表。

<select id="dropdown1">
 <option value="v1">value1</option>
 <option value="v2">value2</option>
 <option value="v3">value3</option>
</select>
<select id="dropdown2">
 <option value="apple">apple</option>
 <option value="orange">orange</option>
</select>

<label id="value1">Value 1:</label>
<div id="showDropDown2"></div>

<label id="value2">Value 2:</label>
<div id="showDropDown2"></div>

<label id="value3">Value 3:</label>
<div id="showDropDown2"></div>

例如,当用户从下拉列表1中选择“value2”并从下拉列表2中选择“orange”时,它将更新值2部分的div内容。当用户选择“value3”,并从下拉列表2中选择“apple”。然后它将更新值3部分的div内容。等等。

1 个答案:

答案 0 :(得分:1)

您可能会发现Jquery是一个有用的库。查看jquery的show和hide函数。实施例

$('#value1').hide()

隐藏了需要隐藏的内容后,使用.on函数将事件挂钩到清单。这些功能可以在Jquery网站上找到。