Javascript.RU

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

Два SELECT и список
Привет всем.
Нужна помощь
Есть набор из двух селектов и небольшой массив данных со значениями из списков и результирующим значением
Как при выборе двух значений селектов, сравнить их с массивом и записать в DIV значение из таблицы?
<select id="" name="select1" class="select-1">
<option onclick="optioner(this)" value="20">20</option>
<option onclick="optioner(this)" value="25">25</option>
<option onclick="optioner(this)" value="30">30</option></select>
<select id="" name="select2" class="select-2">
<option onclick="optioner(this)" value="1.3">1.3</option>
<option onclick="optioner(this)" value="1.4">1.4</option>
<option onclick="optioner(this)" value="1.5">1.5</option></select>
<div id="values"></div>
<script>
data = {
'1.3':{'20':'155'},{'25':'156'},{'30':'157'},
'1.4':{'20':'159'},{'25':'160'},{'30':'170'},
'1.5':{'20':'165'},{'25':'169'},{'30':'172'}
}
</script>

Последний раз редактировалось ugator, 24.10.2015 в 14:25.
Ответить с цитированием
  #2 (permalink)  
Старый 24.10.2015, 14:11
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,075

ugator,
data неправильная и Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:
[js]
... ваш код...
[/js]


О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.
Ответить с цитированием
  #3 (permalink)  
Старый 24.10.2015, 14:20
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,075

ugator,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
</head>

<body>
<select id="" name="select1" class="select-1">
 <option value="20">20</option>
 <option value="25">25</option>
 <option value="30">30</option></select>
 <select id="" name="select2" class="select-2">
 <option value="1.3">1.3</option>
 <option value="1.4">1.4</option>
 <option value="1.5">1.5</option></select>
 <div id="values">155</div>
 <script>
 var data = {
 '1.3':{'20':'155','25':'156','30':'157'},
 '1.4':{'20':'159','25':'160','30':'170'},
 '1.5':{'20':'165','25':'169','30':'172'}
 },
 sel = document.querySelectorAll('select');
 [].forEach.call(sel, function(item) {
         item.addEventListener('change', function() {
             var div = document.getElementById('values');
             div.innerHTML = data[sel[1].value][sel[0].value]
         });
     });
 </script>
</body>

</html>

интересно откуда пошла традиция ставить клики на option последнее время?
Ответить с цитированием
  #4 (permalink)  
Старый 24.10.2015, 14:23
Новичок на форуме
Отправить личное сообщение для ugator Посмотреть профиль Найти все сообщения от ugator
 
Регистрация: 24.10.2015
Сообщений: 9

Сообщение от рони Посмотреть сообщение
ugator,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
</head>

<body>
<select id="" name="select1" class="select-1">
 <option value="20">20</option>
 <option value="25">25</option>
 <option value="30">30</option></select>
 <select id="" name="select2" class="select-2">
 <option value="1.3">1.3</option>
 <option value="1.4">1.4</option>
 <option value="1.5">1.5</option></select>
 <div id="values">155</div>
 <script>
 var data = {
 '1.3':{'20':'155','25':'156','30':'157'},
 '1.4':{'20':'159','25':'160','30':'170'},
 '1.5':{'20':'165','25':'169','30':'172'}
 },
 sel = document.querySelectorAll('select');
 [].forEach.call(sel, function(item) {
         item.addEventListener('change', function() {
             var div = document.getElementById('values');
             div.innerHTML = data[sel[1].value][sel[0].value]
         });
     });
 </script>
</body>

</html>

интересно откуда пошла традиция ставить клики на option последнее время?
Эта традиция пошла от отсутствия опыта в JS
Ответить с цитированием
  #5 (permalink)  
Старый 24.10.2015, 14:28
Новичок на форуме
Отправить личное сообщение для ugator Посмотреть профиль Найти все сообщения от ugator
 
Регистрация: 24.10.2015
Сообщений: 9

А что вот это такое [].forEach - квадратные скобки? Это массив селектов или что такое? Никогда такого в скриптах не видел.
Ответить с цитированием
  #6 (permalink)  
Старый 24.10.2015, 14:31
Новичок на форуме
Отправить личное сообщение для ugator Посмотреть профиль Найти все сообщения от ugator
 
Регистрация: 24.10.2015
Сообщений: 9

Спасибо за решение. Все работает.
Ответить с цитированием
  #7 (permalink)  
Старый 24.10.2015, 14:46
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,075

Сообщение от ugator
А что вот это такое [].forEach - квадратные скобки? Это массив селектов или что такое? Никогда такого в скриптах не видел.
перебор DOM-коллекции
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Создать список select coool7819 Общие вопросы Javascript 6 17.07.2015 10:21
Выпадающий список select kirill1989 Общие вопросы Javascript 0 16.12.2014 20:01
сложить два SELECT ju39ks Общие вопросы Javascript 0 25.06.2014 17:18
Список SELECT с фильтрацией. помогите! Pedro Garciya Lopez jQuery 6 20.03.2014 15:26
селект переделанный под список Vasёk18 Элементы интерфейса 0 13.04.2012 23:49