0

我正在使用 jQuery，我想要做的是在选择下拉 SELECT 选项时触发一个 onChange 事件，该选项将根据所选选项的值显示一个元素。困难的部分是我还希望在选择新选项时显示的任何元素都消失，以便所选元素是唯一显示的元素。我非常接近，但不明白为什么我正在尝试的东西不起作用。

到目前为止，我所拥有的是：

//Dropdown
<select id="menu">
<option val="show1">Show First</option>
<option val="show2">Show Second</option>
...
<option val="show255">Show 255th</option>
</select>

//Invisible areas
<myArea id="show1" style="display:none">
Stuff1
</myArea>

<myArea id="show2" style="display:none">
Stuff2
</myArea>

...

<myArea id="show255" style="display:none">
Stuff255
</myArea>


//JavaScript
<script>
$('#menu').change(function () {
    optName = $('#menu').val();
    $("myArea").not("#" + optName).hide();
    $("myArea").("#" + optName).show();
});
</script>

到目前为止，有效的是，如果我不将 添加style="display:none"到<myArea>元素中，我可以隐藏除所选元素之外的所有元素。但是，当我再次更改选项时，已显示的元素会消失，但所选元素不会显示。如果我style="display:none"在myArea元素上使用它，则在选择任何选项时都不会显示任何内容。

4

2 回答 2

1 
$('#menu').change(function () {
    optName = $('#menu').val();
    $("myArea#" + optName).show().siblings().hide();
});
于 2013-01-12T23:42:32.543 回答
0 
$("myArea").("#" + optName).show();

什么也没做。

$('[id='+optName+']').show();

但是可能对你有用。

于 2013-01-12T23:41:11.573 回答