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, время: 06:53. |