Форум

merzavchick · #1 (**permalink**) 24.08.2012, 18:50

Подскажите пожалуйста как можно поступит в такой ситуации.
Нужно решить проблему, но совсем не силен javascript

Такой HTML:

<div class="block">

   <div class="select-str">Этот текст нужно менять динамически</div>
				
   <select name="" class="select-menu">

   <option value="" selected>Выбирите город</option>
   <option value="">Москва</option>
   <option value="">Сакт-Перербург</option>

   </select>

</div>		

<div class="block">

   <div class="select-str">Этот текст нужно менять динамически</div>
				
   <select name="" class="select-menu">

   <option value="" selected>Выбирите город</option>
   <option value="">Москва</option>
   <option value="">Сакт-Перербург</option>

   </select>

</div>

На странице блоков с меню много штук 5-6. Нужно что бы текст в блоке с классом select-str менялся на значение выбранное в списке select, в пределах блока с классом block.

Подскажите пожалуйста. Очень нужно.

LittlePony · #2 (**permalink**) 24.08.2012, 19:20

$("select.select-menu").change(function(){
$(".block .select-str").text($(this).children("option:selected").text())
})

merzavchick · #3 (**permalink**) 24.08.2012, 19:36

Посмотрите пожалуйста, закинул -http://merav131.coolvds.com/

merzavchick · #4 (**permalink**) 24.08.2012, 20:01

Да, извиняюсь код рабочий, видимо где-то пробел может лишний был. Но к сложению этот вариант меняет текст во всех блоках с классом select-str.

Deff · #5 (**permalink**) 24.08.2012, 20:08

$("select.select-menu").change(function(){
     $(this).parent().text($(this).val())
})

merzavchick · #6 (**permalink**) 24.08.2012, 23:06

К сожалению это вариант тоже не рабочий

Списки пропадают

LittlePony · #7 (**permalink**) 24.08.2012, 23:14

merzavchick, а зря вы ждёте, пока за вас кто-то сделает работу.
Я просто неправильно поняла вашу задачу, но дала вам ссылки на документацию. Deff понял ошибку и поправил, привёл метод, которого не хватало в моём варианте.
Если б вы внимательно и вдумчиво читали код, без проблем бы уже решили свою задачу.
Вы поняли смысл моего ответа? И поняли, почему в моём варианте меняется содержимое всех элементов, удовлетворяющих селектору ".block .select-str"?
Теперь подумайте, как это поведение изменить, использовав метод .parent(), который вам подсказал Deff.

Deff · #8 (**permalink**) 24.08.2012, 23:27

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru" dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Общие вопросы по оформлению (45)</title>

<script type="text/javascript" src="http://yandex.st/jquery/1.4.4/jquery.min.js"></script>

</head>
<body style="width:100%;text-align:center;">


<style type="text/css">
#My{
 margin:50px auto;
}
#My:hover tr#first td{
     background-color:cyan;
}
.selected-2 {
    background-color:#FCCEFC;
}
.selected {
    background-color:cyan;
}

</style>

<div class="block">

   <div class="select-str">Этот текст нужно менять динамически</div>
				
   <select name="" class="select-menu">

   <option value="" selected>Выберите город</option>
   <option value="">Москва</option>
   <option value="">Сакт-Перербург</option>

   </select>

</div>		

<div class="block">

   <div class="select-str">Этот текст нужно менять динамически</div>
				
   <select name="" class="select-menu">

   <option value="" selected>Выерите город</option>
   <option value="">Москва</option>
   <option value="">Сакт-Перербург</option>

   </select>

</div>


<script type="text/javascript">
$("select.select-menu").change(function(){
     $(this).parent().find('.select-str').text($(this).find("option:selected").text()) 
})
</script>

</body>
</html>

LittlePony · #9 (**permalink**) 24.08.2012, 23:32

Deff, мне кажется, не стоило.

merzavchick · #10 (**permalink**) 24.08.2012, 23:57

Большое спасибо. Очень приятно что вы даете толчок к развитию. Вы правы, сюда пришел за тем, что бы за меня кто-то сделал. Так получилось, обычно сам ковыряюсь. Сейчас сроки поджимали. Очень вам признателен за помощь.

Форум

Справочник

Discord чат

Курсы javascript