Усовершенствование скрипта доступности поля в зависимости от выбора в списке.
Вопрос от начинающего изучение 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, время: 15:54. |