Не возможно выбрать другое значение
Подскажите, пожалуйста...
Есть SELECT с onChange <select name="PB2001" id="PB2001" class="text" onblur="checkPassword()" onChange="fifeno()"> <option value="?">?</option> <option value="no">no</option> <option>(BG) NFF LO</option> <option>(BG) NFF RX</option> <option>(AT) KKO LO</option> </select> и скрипт на выполнение измемения значения... Смысл которого в следующем... Если выбрано значение Селекта "no", то появляются еще 2 поля для ввода... Если выбраны другие значения - то эти поля - невидимы (как и по умолчанию при загрузке страницы) <script> function fifeno() { if (document.getElementById('PB2001').value='no'){ document.getElementById('PB').style.display='block'; document.getElementById('PN').style.display='block'; document.getElementById('PBT').style.display='block'; } else { document.getElementById('PB').style.display='none'; document.getElementById('PN').style.display='none'; document.getElementById('PBT').style.display='none'; }} </script> Проблема: При загрузке страницы "другие поля" невидимы, т.е. ОК Если выбираю значение "no" - то 2 невидимых поля появляются. НО! После этого какое бы значение , отличное от "no" я не выбирал бы - все равно "no", т.е. не возможно установить другое значение. Что не так? Или как? )) Помогите, плз. Оч. надо! |
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Example</title> <style type="text/css"> #input{display:none;} </style> </head> <body> <select name="PB2001" onchange="fifeno(this)"> <option value="?">?</option> <option value="no">no</option> <option value="(BG) NFF LO">(BG) NFF LO</option> <option value="(BG) NFF RX">(BG) NFF RX</option> <option value="(AT) KKO LO">(AT) KKO LO</option> </select> <input name="input" id="input" value="Появился"> <script type="text/javascript"> function fifeno(self) { var input=document.getElementById('input'); if('no'==self.value) { if(!input.style.display) { input.style.display='block'; } } else if('block'==input.style.display) { input.style.display=''; } } </script> </body> </html> |
Спасибо. Заработало.
Извините, что сразу все не написал, но возникла следующая ситуация. У меня 3 скрытых поля, что нужно дописать...что бы 3 поля скрывались и появлялись сразу. Я попробовал добавить в скрипт второй вар, но не помогло var input=document.getElementById('input'); var input=document.getElementById('input2'); |
BLP, обращаться к свойству display у каждого по отдельности...
или засунуть все поля в какой-нибудь блок, например, div или span, и скрывать уже его |
Спасибо, получилось... ))) Но, как всегда, цепная реакция...
Вообщем, задача еще немного усложняется (надеюсь это у меня последнее). Как прописать, чтобы при вводе значения "no" - первое поле (input)) появлялось, а второе (input2)- скрывалось... При значении "?" - скрывались оба поля, а при выборе остальных значений, первое (input) - скрывалось, а второе (input2) - появлялось... (Вот задачка для меня! Полдня перепробовал варианты, в результате - Здесь засуну, там вылезет, там засуну, здесь вылазит... ))) <body> <select name="PB2001" onchange="fifeno(this)"> <option value="?">?</option> <option value="no">no</option> <option value="(BG) NFF LO">(BG) NFF LO</option> <option value="(BG) NFF RX">(BG) NFF RX</option> <option value="(AT) KKO LO">(AT) KKO LO</option> </select> <input name="input" id="input" value="Появился"> <input name="input2" id="input2" value="Появился"> <script type="text/javascript"> function fifeno(self) { var input=document.getElementById('PB'); var input2=document.getElementById('PN'); if('no'==self.value) { if(!input.style.display) { input.style.display='block'; input2.style.display=''; } } else if('block'==input.style.display) { input.style.display=''; input2.style.display='block'; } } </script> </body> |
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Example</title> <style type="text/css"> #input input{display:none;} </style> </head> <body> <select name="PB2001" onchange="fifeno(this)"> <option value="?">?</option> <option value="no">no</option> <option value="two">two</option> <option value="(BG) NFF LO">(BG) NFF LO</option> </select> <div id="input"> <input name="input1" value="Появился1"> <input name="input2" value="Появился2"> </div> <script type="text/javascript"> function arrayInput() { return document.getElementById('input').getElementsByTagName('input'); } function inputStyle(key) { return arrayInput()[key].style; } function inputToggle(val) { for(var i in arrayInput()) { if(true===val || i==val) { inputStyle(i).display='block'; } else { inputStyle(i).display=''; } } } function fifeno(self) { if('no'==self.value) { inputToggle(0); } else if('?'==self.value) { inputToggle(); } else if('two'==self.value) { inputToggle(true); } else { inputToggle(1); } } </script> </body> </html> |
BLP,
<body> <select name="PB2001" onchange="fifeno(this)"> <option value="?">?</option> <option value="no">no</option> <option value="(BG) NFF LO">(BG) NFF LO</option> <option value="(BG) NFF RX">(BG) NFF RX</option> <option value="(AT) KKO LO">(AT) KKO LO</option> </select> <input name="input" id="input" value="Появился1"> <input name="input2" id="input2" value="Появился2"> <script type="text/javascript"> function fifeno(self) { var input=document.getElementById('input'), input2=document.getElementById('input2'); switch (self.value) { case "no": { input.style.display = "block"; input2.style.display = "none"; break; } case "?": { input.style.display = "none"; input2.style.display = "none"; break; } default: { input.style.display = "none"; input2.style.display = "block"; break; } } } </script> </body> |
Пока попробовал код от lord2kim ...
почему-то вообще ни на что не реагирует ((( Ща попробую код от YOUR -------------- 2 минуты спустя... Уряяя! lord2kim , спасибо. Все получилось по-Вашему. ))) Просто немного запутался в переменных и именах полей... (Здесь я упрощенно их писал, чтобы не путать, у себя полей больше и с другими именами (отличными от input1, 2 и т.д.) |
Часовой пояс GMT +3, время: 17:50. |