| |
|
|
| | Доброго времени суток!
Хотел реализовать идею проверки правильности ввода пароля в основное и контрольное поле при регистрации.
HTML:
<div class="field">
<span id="param_fields">Напишите два раза пароль:</span>
<input name="pass1" id="pass1" type="password" maxlength="32" /> <span id="passcheck"></span> <input name="pass2" id="pass2" type="password" maxlength="32" />
</div>
|
JavaScript:
$('#pass1').keypress(function() {
var pass1 = $('#pass1').val();
if(pass1.length<3){
$('#passcheck').text(' Мало! ');
}
else{
$('#passcheck').text('');
}
});
$('#pass2').keydown(function() {
var pass1 = $('#pass1').val();
var pass2 = $('#pass2').val();
if(pass2!=pass1){
$('#passcheck').html('<img src="../../pict/ravno_no.png" class="img_notes">');
}
else{
$('#passcheck').html('<img src="../../pict/ravno.png" class="img_notes">');
}
});
|
НО проблема в том, что keypress & keydown инисциируют проверку условия ПОСЛЕ нажатия клавиши. То есть, введя, к примеру, в первое поле "1234", во второе поле нужно ввести "1234" + еще одно нажатие любой клавиши. То есть пароли не буду эквивалентны.
Есть ли какое-нибудь решение?
Спасибо. | |
| |
|
|
| |
|
|
| |
для: Deed
(10.05.2012 в 21:09)
| | | Производить проверку надо тогда, когда длина обеих полей равна, и не по keydown, keypress, а по keyup.
if(pass1.length<3){ $('#passcheck').text(' Мало! '); } - а 4 значит нормально? | |
| |
|
|
| |
|
|
| |
для: confirm
(11.05.2012 в 00:47)
| | | Спасибо, друже! | |
| |
|
|
| |
|
|
| |
для: Deed
(10.05.2012 в 21:09)
| | | Давайте будем профессиональны - будем проверять события над обеими инпутами (ведь никто не запрещает пользователю заполнять поля в любом порядке), а также учтём, что пользователь может щёлкнуть по инпуту правой кнопкой мыши и сделать Paste (для этого подойдёт событие mouseleave)
//<?
$("#pass1, #pass2").bind("keyup mouseleave", function() {
var v = [$("#pass1").val(), $("#pass2").val()];
$("#passcheck").text( v[0] && v[0].length < 3 ? ' Мало! ' : '');
if (!v[1]) return;
var equal = v[0] == v[1];
$('#passcheck').html('<img src="../../pict/ravno' + (equal ? '' : '_no') + '.png" class="img_notes">');
});
|
Настоятельно рекомендую поменять решение с отображением картинки:
1. Поместите две картинки в один спрайт.
2. Создайте контейнер (например div) вместо картинки и пропишите ему два класса в CSS (например "no" и "ok") с соответствующими backround-position.
3. В скрипте, вместо html, меняйте класс:
//<?
$('#passcheck').attr('class', equal ? 'ok' : 'no');
|
| |
| |
|
|
| |
|
|
| |
для: bishake
(11.05.2012 в 12:05)
| | | bishake, колоссальное Вам спасибо!
Как Вы мне помогли!.. Дело в том, что я только-только подвигся на изучение и JS, и jQuery. | |
| |
|
|
