Аквтивность неактивность кнопки по тексту формы
Здравствуйте, суть вопроса: имеется 2-а поля.
Логин и Пароль. Плюс кнопка входа. Хотелось бы чтобы пока поля пустые, кнопка неактивна, как только введён текст в эти поля больше чем 3-и символа в каждое поле, кнопка становится активной. Вот что я нагуглил набросал, но к сожалению не работает....( Буду благодарен вашим наставлениям и исправлениям. <script type="text/javascript"> //Код, выполняемый всегда var usr=document.getElementById('user').value; var pas=document.getElementById('password').value; if((usr.length < 3) && (pas.length < 3)) { document.getElementById('button').disabled=true; } else document.getElementById('button').disabled=false; //Проверка полей function checkFields(form){ if(form.name!="login") return false; var usr=form.elements['usr'].value; if(usr==''){ alert('Имя не может быть пустым'); form.elements['usr'].focus(); return false; } return true; } </script> <form class="forma" action="" method="POST" name="login" onSubmit="return checkFields(this)"> <table border=0> <tr> <td> <b>Имя:</b> </td> <td> <input type="text" name="usr" id="user"> </td> <tr> <td> <b>Пароль:</b> </td> <td> <input type="password" name="passwd" id="password"> </td> <tr> <td colspan="2"> <input type="submit" value="Войти" name="but" id="button"> </td> </table> </form> |
Цитата:
|
<script type="text/javascript"> //Код, выполняемый всегда function f(){ var usr= document.getElementById('us').value; var pas= document.getElementById('pass').value; if((usr.length < 3) && (pas.length < 3)) { document.getElementById('butt').disabled=true; } else document.getElementById('butt').disabled=false; } //Проверка полей function checkFields(form){ if(form.name!="login") return false; var usr=form.elements['usr'].value; if(usr==''){ alert('Имя не может быть пустым'); form.elements['usr'].focus(); return false; } return true; } </script> <form class="forma" action="" method="POST" name="login" onSubmit="return checkFields(this)"> <table border=0> <tr> <td> <b>Имя:</b> </td> <td> <input type="text" name="usr" onchange="f()" id="us"> </td> <tr> <td> <b>Пароль:</b> </td> <td> <input type="password" name="passwd" onchange="f()" id="pass"> </td> <tr> <td colspan="2"> <input type="submit" value="Войти" name="but" id="butt" disabled="true"> </td> </table> </form> попробуйте вот так у меня в ie, chrome работает. |
if((usr.length < 3) && (pas.length < 3))
{ document.getElementById('butt').disabled=true; } else document.getElementById('butt').disabled=false; } Вот эту строчку можно укоротить кстати if((usr.length > 3) && (pas.length > 3)) document.getElementById('butt').disabled=false; |
Спасибо за помощь,
главная ошибка была и тут=) if((pas.length < 5) || (usr.length < 5)) |
document.getElementById('butt').disabled = ((usr.length < 3) || (pas.length < 3)); |
Цитата:
|
У меня возник другой вопрос.
Когда я ввожу логин и пароль. Пока я не тыкну курсором по экрану кнопка не станет активной. Тоесть я сначала ввожу логин после пароль нужной длинны, После необходимо курсором тыкнуть в пустое поле странички и тогда кнопка становится активной. А как избежать этого клика? |
Цитата:
|
Цитата:
Могли бы вы объяснить по подробнее что, как, где,. К сожалению в этой сфере я разбираюсь только со вчерашнего вечера) |
Часовой пояс GMT +3, время: 09:16. |