Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 10.11.2014, 13:53
Аватар для moslem
Аспирант
Отправить личное сообщение для moslem Посмотреть профиль Найти все сообщения от moslem
 
Регистрация: 22.07.2013
Сообщений: 30

Формы, select
Добрый день, столкнулся с такой проблемой, нужно сделать в форме следующее действия.

http://jsbin.com/wiroxevoki/1/edit?html,css,output

Вот сама форма, нужно сделать так, когда мы выбираем "Вопрос 1" в select id="subject" , появлялась select #price то есть у него становилось display: block;

Как можно подобное реализовать?
Ответить с цитированием
  #2 (permalink)  
Старый 10.11.2014, 13:59
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

1. находишь свой select, например так: $('select[name=subject]')
2. навешиваешь событие onchange
3. ставишь условие, если значение равно "Вопрос 1", то находим второй селект (примерно как в первом пункте) и присваиваем block: $(...).css('display', 'block');
Ответить с цитированием
  #3 (permalink)  
Старый 10.11.2014, 14:23
Аватар для moslem
Аспирант
Отправить личное сообщение для moslem Посмотреть профиль Найти все сообщения от moslem
 
Регистрация: 22.07.2013
Сообщений: 30

skrudjmakdak, можешь посмотреть что за ошибки здесь допустил

$(function() {
    $('select[name=subject]').change(function () {
    if(select[name=subject].val() === "Вопрос 1") {
      $('#price').css("display", "block");
    }
    });
});
Ответить с цитированием
  #4 (permalink)  
Старый 10.11.2014, 17:25
Профессор
Посмотреть профиль Найти все сообщения от krutoy
 
Регистрация: 09.11.2014
Сообщений: 610

moslem, вот так попробуйте:
<!DOCTYPE html>
<html>
<head>
  <meta charset="windows-1251">
  <title>JS Bin</title>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  <style>
    #price{display: none}
  </style>
</head>
<body>
<form action="/">
  <input type="text" placeholder="Имя"><br /><br />
  <input type="text" placeholder="Номер"><br /><br />
  <select name="subject" id="subject">
    <option>Выберите вопрос</option>
    <option>Вопрос 1</option>
    <option>Вопрос 2</option>
  </select><br /><br />
  <select name="price" id="price">
    <option>Вопрос 3</option>
    <option>Вопрос 4</option>
  </select><br /><br />
  <input type="submit" value="Send">
</form>
 <div></div>
<script>
price=document.querySelector("#price")
subject=document.querySelector("#subject")
subject.onchange=function(){
if(this.value==="Вопрос 1") price.style.display="block"
}
</script>
</body>
</html>
Ответить с цитированием
  #5 (permalink)  
Старый 10.11.2014, 19:23
Аватар для moslem
Аспирант
Отправить личное сообщение для moslem Посмотреть профиль Найти все сообщения от moslem
 
Регистрация: 22.07.2013
Сообщений: 30

krutoy,
спасибо то что нужно
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как передать значение select из формы в переменную javascript 2Step Общие вопросы Javascript 2 11.03.2014 21:11
проверка формы не работает в ie begelme Javascript под браузер 6 13.08.2013 00:00
Метод для конвертирования едениц px, em, %, pt. jegit Элементы интерфейса 0 07.03.2013 14:15
Открытие формы select Vitalyk Events/DOM/Window 2 19.03.2010 01:22
load + php подгрузка формы Karandash jQuery 4 01.12.2009 12:04