Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 20.03.2013, 20:44
Аспирант
Отправить личное сообщение для Marker Посмотреть профиль Найти все сообщения от Marker
 
Регистрация: 06.01.2013
Сообщений: 95

select change
У меня есть селект.

<select class="select">
<option>Երևան</option>
<option>Երևանի արվարձաններ</option>
<option disabled="disabled">-----------------------------------</option>
<option>Արագածոտն</option>
<option>Արարատ</option>
<option>Արմավիր</option>
<option>Գեղարքունիք</option>
<option>Լոռի</option>
<option>Կոտայք</option>
<option>Շիրակ</option>
<option>Սյունիք</option>
<option>Վայոց Ձոր</option>
<option>Տավուշ</option>
</select>


так же див.. (и таких много)

<div id="erevan">
<p><input type='checkbox' class="ray" name='poqr_kentron' />Փոքր Կենտրոն</p>
<p><input type='checkbox' class="ray" name='arabik' />Արաբկիր</p>
<p><input type='checkbox' class="ray" name='mec_kentron' />Մեծ Կենտրոն</p>
<p><input type='checkbox' class="ray" name='ajapnyak' />Աջափնյակ</p>
<p><input type='checkbox' class="ray" name='davtashen' />Դավթաշեն</p>
<p><input type='checkbox' class="ray" name='qanaqer' />Քանաքեռ-Զեյթուն</p>
<p><input type='checkbox' class="ray" name='nor_norq' />Նոր Նորք</p>
<p><input type='checkbox' class="ray" name='avan' />Ավան</p>
<p><input type='checkbox' class="ray" name='malatia' />Մալաթիա-Սեբաստիա</p>
<p><input type='checkbox' class="ray" name='shengavit' />Շենգավիթ</p>
<p><input type='checkbox' class="ray" name='erebuni' />Էրեբունի</p>
<p><input type='checkbox' class="ray" name='nubarashen' />Նուբարաշեն</p>
</div>

у него поставлен display:none;

Я хочу сделать так, когда кликаеться на первую опцию, появляеться этот див(display:block), если другой, то отображаеться другой..

Я это представляю так..

$('.select').change(function() {
var sel = $('.select').val();
if(sel == 'Երևան') {
$('#erevan').css('display','block');
}
});


Такой способ не работает, помогите решит ь проблему.. Благодарю
Ответить с цитированием
  #2 (permalink)  
Старый 20.03.2013, 21:16
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 30,363

Marker,
добавьте value в option с id и добавьте класс hide во все дивы тогда возможен такой вариант ...
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
<style type="text/css">
<!--
.hide{
  display: none;
}

-->
</style>
 <script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
    $(function() {
        $('.select').change(function() {
var sel = $('.select').val();
$(".hide").hide()
$("#"+sel).show();
});
    });
</script>
</head>

<body>
<select class="select">
<option value="erevan">Երևան</option>
<option>Երևանի արվարձաններ</option>
<option disabled="disabled">-----------------------------------</option>
<option>Արագածոտն</option>
<option>Արարատ</option>
<option>Արմավիր</option>
<option>Գեղարքունիք</option>
<option>Լոռի</option>
<option>Կոտայք</option>
<option>Շիրակ</option>
<option>Սյունիք</option>
<option>Վայոց Ձոր</option>
<option>Տավուշ</option>
</select>
<div id="erevan" class="hide">
<p><input type='checkbox' class="ray" name='poqr_kentron' />Փոքր Կենտրոն</p>
<p><input type='checkbox' class="ray" name='arabik' />Արաբկիր</p>
<p><input type='checkbox' class="ray" name='mec_kentron' />Մեծ Կենտրոն</p>
<p><input type='checkbox' class="ray" name='ajapnyak' />Աջափնյակ</p>
<p><input type='checkbox' class="ray" name='davtashen' />Դավթաշեն</p>
<p><input type='checkbox' class="ray" name='qanaqer' />Քանաքեռ-Զեյթուն</p>
<p><input type='checkbox' class="ray" name='nor_norq' />Նոր Նորք</p>
<p><input type='checkbox' class="ray" name='avan' />Ավան</p>
<p><input type='checkbox' class="ray" name='malatia' />Մալաթիա-Սեբաստիա</p>
<p><input type='checkbox' class="ray" name='shengavit' />Շենգավիթ</p>
<p><input type='checkbox' class="ray" name='erebuni' />Էրեբունի</p>
<p><input type='checkbox' class="ray" name='nubarashen' />Նուբարաշեն</p>
</div>

</body>

</html>
Ответить с цитированием
  #3 (permalink)  
Старый 20.03.2013, 21:38
Профессор
Отправить личное сообщение для Mukhtar Посмотреть профиль Найти все сообщения от Mukhtar
 
Регистрация: 08.10.2010
Сообщений: 201

$(document).ready(function(e) {
       $('#mySelect').change(function(){
            var id = $(this).data("section");
            $('#'+id).show();     
        });
            e.preventDefault(); 
    });

<select name="mySelect" id="mySelect">
<option value="0" data-section="item1">item1</option>
<option value="1" data-section="item2">item2</option>
</select>
<div id="item1" style="display:none;">
text1
</div>
<div id="item2" style="display:none;">
text2
</div>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Метод для конвертирования едениц px, em, %, pt. jegit Элементы интерфейса 0 07.03.2013 14:15
Элемент select, событие change an.semionov jQuery 6 31.05.2012 21:28
Как сохранить предыдущее значение select? MaxD Общие вопросы Javascript 3 21.07.2011 11:36
Select option change ajax dopelher jQuery 6 08.07.2011 15:23
Проблема с динамическим формированием select elepsion jQuery 1 31.10.2010 13:31