Усовершенствование скрипта доступности поля в зависимости от выбора в списке.
Вопрос от начинающего изучение JavaScript.
У меня была задача сделать контекстно-зависимое поле, и я нашел подходящее решение на одном англоязычном форуме:
<script>
function findselected(){
var state = document.getElementById('state');
var notus = document.getElementById('notus');
(state.value == "Other")? notus.disabled=false : notus.disabled=true
}
</script>
<form action="" method="POST" name="form1"> <select name="state" id="state" onChange="findselected()"> <option value="NY">NY</option> <option value="NJ">NJ</option> <option value="CT">CT</option> <option value="Other">Other</option> </select> <input type="text" maxlength="50" size="20" id="notus" name="notus" disabled> </form> Последний пункт списка при загрузке страницы может быть неопределен – <option value="Other">Other</option> или определен по умолчанию – <option value="Other" selected="selected">Other</option> (в зависимости от сохраненного ранее выбора). Проблема заключается в следующем: Когда загружается страница с <option value="Other" selected="selected">Other</option> текстовое поле <input type="text" maxlength="50" size="20" id="notus" name="notus" disabled> остается недоступным, а надо чтоб оно было доступным, если пункт Other определен. Жду ваших предложений. |
вызови
findselected() она проверяет, какое значение у селекта? если да, то вызывай. если нет - пиши @ раширяй |
Не разобрался я с findselected()
Решил проблему вот так:
<script>
function slct() {
var state1 = document.getElementById('other');
var notus = document.getElementById('notus');
if(state1.selected == true) { notus.disabled = false;}
}
function findselected(){
var state = document.getElementById('state');
var notus = document.getElementById('notus');
(state.value == "Other")? notus.disabled=false : notus.disabled=true;
}
</script>
</head>
<body onLoad="slct()">
<form action="" method="POST" name="form1" >
<select name="state" id="state" onChange="findselected()">
<option value="NY">NY</option>
<option value="NJ">NJ</option>
<option value="CT" >CT</option>
<option value="Other" id="other" selected="selected">Other</option>
</select>
<input type="text" maxlength="50" size="20" id="notus" name="notus" disabled>
</form>
*(написал функцию, + вызов на onLoad для body и id для требуемого элемента) Не очень изящно, но зато работает. Если у кого будет время прошу показать пример с findselected() |
O_o а чего с ней не разбираться?
смотри :
<form action="" method="POST" name="form1" >
<select name="state" id="state" onChange="findselected()">
<option value="NY">NY</option>
<option value="NJ">NJ</option>
<option value="CT" >CT</option>
<option value="Other" id="other" selected="selected">Other</option>
</select>
<input type="text" maxlength="50" size="20" id="notus" name="notus" disabled>
</form>
<script>
var input = document.getElementById('notus'),
select = document.getElementById('state');
// без привязки к элементу! (this)
function findselected(){
if( select.value === "Other" ){
// если еще не поставили false
// это чтобы каждый раз не дёргать
if( notus.disabled )
notus.disabled = false;
} else {
if( !notus.disabled )
notus.disabled = true;
}
}
select.onchange = findselected;
findselected();
</script>
|
| Часовой пояс GMT +3, время: 14:19. |