Скрыть и показать
При выборе значения из 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(); |
$('#method').change(function () { $('#list div').hide(); $('#' + this.value).show(); }); |
exec, спасибо. Который раз удивляюсь возможностям jquery.
|
Часовой пояс GMT +3, время: 19:32. |