Форум

neonlight · #1 (**permalink**) 09.07.2011, 22:52

Вопрос от начинающего изучение 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 определен.
Жду ваших предложений.

melky · #2 (**permalink**) 09.07.2011, 22:56

вызови

findselected()

она проверяет, какое значение у селекта?

если да, то вызывай. если нет - пиши @ раширяй

neonlight · #3 (**permalink**) 10.07.2011, 03:09

Не разобрался я с 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()

melky · #4 (**permalink**) 10.07.2011, 10:05

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>

Форум

Справочник

Discord чат

Курсы javascript