document.getElementById и select
Доброго времени суток всем. У меня такой вопрос к знающим людям.
Есть форма <form name="qwe"> <select onchange="document.getElementById('id_2').innerHTML=this.options[this.selectedIndex].value;" ;> <option value =" "></option> <option value=1>бла</option> <option value=2>бла бла</option> <option value=3 >бла бла бла</option> </select> </form> <div id="id_2"></div> При выборе значения из списка, на страницу выводится номер 1, 2, 3. Подскажите как мне выводить текст в зависимости от выбранного элемента. Не номер, не бла, бла бла, а свой текст? За ранее спасибо. |
<script> values=[ 'ноль', 'один', 'два', 'три' ] values.undefined = 'нетути'; </script> <form name="qwe"> <select onchange="document.getElementById('id_2').innerHTML=values[this.selectedIndex]"> <option value =" "></option> <option value=1>бла</option> <option value=2>бла бла</option> <option value=3 >бла бла бла</option> </select> </form> <div id="id_2"></div> |
Спасибо
|
А что сделать, чтобы values.undefined = 'не тупи'; заработало?
<script> values=[ 'ноль', 'один', ] values.undefined = 'не тупи'; </script> <form name="qwe"> <select onchange="document.getElementById('id_2').innerHTML=values[this.selectedIndex]"> <option value =" "></option> <option value=1>бла</option> <option value=2>бла бла</option> <option value=3 >бла бла бла</option> <option value=4 >бла бла бла бла</option> </select> </form> <div id="id_2"></div> |
id_2.innerHTML = values[this.selectedIndex] || 'не тупи' Можно еще так: <form name="qwe"> <select onchange="id_2.innerHTML = selectedOptions[0].getAttribute('data-text') || 'не тупи'"> <option value=0 data-text="ноль"></option> <option value=1 data-text="одын">бла</option> <option value=2 data-text="двы">бла бла</option> <option value=3>бла бла бла</option> <option value=4>бла бла бла бла</option> </select> </form> <div id="id_2"></div> |
document.getElementById('id_2').innerHTML=this.value |
Цитата:
|
Цитата:
Большое спасибо! :dance: |
Цитата:
Цитата:
Цитата:
|
и так тоже:
Цитата:
document.getElementById('id_2').innerHTML=this.value самый правильный вариант: <form name="qwe"> <select id="my_select"> <option value="0"></option> <option value="1">бла</option> <option value="2">бла бла</option> <option value="3">бла бла бла</option> <option value="4">бла бла бла бла</option> </select> </form> <div id="id_2"></div> <script type="text/javascript"> (function() { var texts = [ "ololol", "hahaha", ], select = document.getElementById('my_select'), id2 = document.getElementById('id_2'), eventHandler = function() { id2.innerHTML = texts[select.value] || "не тупи"; } if (select.addEventListener) { select.addEventListener('change', eventHandler, false); } else { select.attachEvent('onchange', eventHandler); } })(); </script> |
Цитата:
|
Ребята, а как то же самое в input=text сделать? Код:
Код:
<script> |
Точно также, только свойство не .innerHTML, а .value
Ну и если инпут в той же форме, то можно вместо document.getElementById написать this.form.inputName (где inputName имя инпута (атрибут name)). |
this.form.inputName('price').value=values[this.selectedIndex]
Не работает. Или я что то не так делаю. |
this.form.price.value=values[this.selectedIndex] Кстати не проще ли сделать так: <form name="qwe"> <select onchange="form.price.value = this.value"> <option value="36 000">140*200 см</option> <option value="38 000">160*200 см</option> </select> <input type="text" name="price" value="36 000" size="25"> </form> И между прочим значения с пробелами нужно оборачивать в кавычки. |
Большое спасибо! Всё работает.
|
Нет не проще, нужно передать другой странице и размер и цену. Хотя может и есть решения проще.
|
Цитата:
|
Помоему selectedOptions не кроссбраузерное.
Venzeles, пробуй this[this.selectedIndex].getAtt... |
Привет всем
Профессор подскажите можно ли сделать следующее: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Документ без названия</title> <script> /*функция, отображающая результат на странице */ function changeResult(result){ document.getElementById('result').innerHTML = result; } /*функция, проводящая непосредственно вычисления */ function calculateForm(){ var result = document.getElementById('id_2').value=prices; changeResult(result); } </script> </head> <body> <script> var prices=[ ' ', 880, 2360, 2530 ] </script> <form id="f"> <select onchange="document.getElementById('id_2').innerHTML=prices[this.selectedIndex]"> <option value =" "></option> <option value=1>Глухая дверь ДГ001</option> <option value=2>Межкомнатная дверь ДО002</option> <option value=3 >Межкомнатная дверь ДО003</option> </select> </form> <div id="id_2"></div> <!--Кнопка рассчитать --> <div onClick="calculateForm();" style="cursor:hand;cursor:pointer;">Рассчитать</div> <!-- Контейнер вывода результата --> <div id="result"></div> </body> </html> Сделать сложение. При нажатии рассчитать выходят все значения prices, не могу сделать чтоб выходили числа по значению value подскажите плиз. |
GreenJo,
на onchange передайте в стороннюю функцию ну или в анонимную через this текущее значение выбранного элемента, уберите пробел для значения по умолчанию. В обработчике, если думаете передавать именно цифры, проверти тип значения, если пришла не цифра, сделать возврат... ну а дальше, если только пара значений, можно через ифы, если много, через switch. Но если делать через switch, тогда и не обязательно делать проверку ожидаемого типа данных, зависит, будет ли вызвана функция внутри для каждого случая или переписано базовое значение с последующим вызовом функции. Да и еще, так, как пытаетесь запускать изменение не с единого место, то лучше использовали единый обработчик, как на изменение выбранного значения, так и на нажатие кнопки, который сам будет просто каждый раз вытаскивать текущее активное значение. |
Я немного слабоват в js если не трудно можешь в данной строчке внести поправку, наглядно я лучше пойму
|
GreenJo,
просто, если это сделает кто то, а не вы сами, вы не научишься применять... что за чем и как должно работать, схему описал, попробуй реализовать... Разбей на шаги описание и шаг за шагом, ищи, что как делается, тогда сможешь запомнить... просто написанное мной, довольно таки легкое, если не сможешь этого реализовать, то что будет дальше...? думаю, что ничего хорошего... |
Часовой пояс GMT +3, время: 08:23. |