При выборе значения из select box должен показываться div с id равным выбранному значению.
<div class="columns">
<div>
<select id="method">
<option value="show_one">Show one</option>
<option value="show_two">Show two</option>
<option value="show_three">Show three</option>
</select>
</div>
</div>
<div id="list">
<div id="show_one">
one
</div>
<div id="show_two">
two
</div>
<div id="show_three">
three
</div>
</div>
Первая мысль написать так:
if $("#method").value=="show_one"
{
$("#show_one").show();
$("#show_two").hide();
$("#show_three").hide();
}
if $("#method").value=="show_two"
{
$("#show_one").hide();
$("#show_two").show();
$("#show_three").hide();
}
if $("#method").value=="show_three"
{
$("#show_one").hide();
$("#show_two").hide();
$("#show_three").show();
}
Однако, если значений около 10, то написание уже занимает много времени.
Как переписать выше приведенный код в более короткий и который бы не зависел от количества значений в selectbox?
Псевдо-jquery код
$("list < #"+$("#method").selected.value").show();
$("list not "#"+$("#method").selected.value").hide();