проверка в реальном времени с помощью javascript - onchange запускается только один раз - PullRequest
Новая
       2

проверка в реальном времени с помощью javascript - onchange запускается только один раз

5 голосов
/ 12 ноября 2011

Так что я просто что-то тестирую с помощью js, в основном число на первом входе должно быть больше, чем число на втором входе для активации кнопки отправки.

Кнопка get просто отключенаверно, но если я изменю номер, он не будет активирован снова 

<!DOCTYPE HTML>
<html>
<body>
<input type='number' id='first' onchange="validateNumber()"/><br>
<input type='number' id='second' onchange="validateNumber()"/><br>
<script type="text/javascript" >
function validateNumber()
{
var first = document.getElementById('first').value;
var second = document.getElementById('second').value;

if(first > second){
document.getElementById('sub').disabled=false;
}else{
document.getElementById('sub').disabled=true;   
}


}
</script>
<input type="submit" id="sub"/>
</body>
</html>

Редактировать: стрелки ввода чисел вызывают переключение, кажется, что вызвало проблему

Ответы [ 3 ]

5 голосов
/ 12 ноября 2011

Вы должны добавить событие onclick и onkeyup, чтобы реагировать на взаимодействия с мышью и вставки из буфера обмена:

http://jsfiddle.net/wzvvN/1

<input type='number' id='first' onkeyup="validateNumber()" onclick="validateNumber()" onchange="validateNumber()" />

<input type='number' id='second' onkeyup="validateNumber()" onclick="validateNumber()" onchange="validateNumber()" />
3 голосов
/ 12 ноября 2011

Попробуйте связать события onfocus и onblur с. 

<input type='number' id='first' onchange="validateNumber()" onfocus="validateNumber()" onblur="validateNumber()"/><br>
<input type='number' id='second' onchange="validateNumber()" onfocus="validateNumber()" onblur="validateNumber()"/><br>
3 голосов
/ 12 ноября 2011

Возможно, вы захотите использовать onkeyup(), поскольку onchange() вызывается только при переключении фокуса на другой элемент.

Кроме того, ваша функция в настоящее время сравнивает строки.Используйте parseInt, чтобы преобразовать в целое число, а затем сравнить.У меня работает следующий код: 

<html>
<body>
<input type='number' id='first' onkeyup="validateNumber()"/><br>
<input type='number' id='second' onkeyup="validateNumber()"/><br>
<script type="text/javascript" >
function validateNumber()
{
  var first = parseInt(document.getElementById('first').value, 10);
  var second = parseInt(document.getElementById('second').value, 10);

  if(first > second){
    document.getElementById('sub').disabled=false;
  } else {
    document.getElementById('sub').disabled=true;   
  }
}
</script>
<input type="submit" id="sub" disabled="disabled" />
</body>
</html>
...