Предупреждающие сообщения Javascript в бесконечном цикле - PullRequest
6 голосов
/ 15 июня 2011

Боксы предупреждений в бесконечном цикле, здесь я пытаюсь поместить всплывающее предупреждающее сообщение на 2 последовательных поля, чтобы их нельзя было оставить пустыми, я знаю, почему это происходит - потому что когда запускается событие onblur 1-й функции, оно фокусируетсявторой, и когда он возвращается к первому, запускается онблур 2-го текстового поля.

Я знаю, что проверка будет лучше, если она будет выполнена на уровне формы, но это требование, которое я получил.

Любая помощь?

Код Javascript

function x()
{
   if( document.getElementById("1").value.length==0)
   {
      alert('1 is required');
      document.getElementById("1").focus();
   }
}

function y()
{
   if(document.getElementById("2").value.length==0)
   {
      alert('2 is required');
      document.getElementById("2").focus();
   }
}

HTML код

<input type="text" name="City Name" id="1" onblur="javascript:x();">
<input type="text" name="Kitty Name" id="2" onblur="javascript:y();">

Ответы [ 13 ]

0 голосов
/ 15 июня 2011

Попробуйте это

<html>
    <head>
    <script>

function x() {
   if (document.getElementById("input1").value.length == 0 ) {
     alert('1 is required');
     document.getElementById("input1").focus();

   }
   else  if (document.getElementById("input2").value.length == 0 ) {
     alert('2 is required');
     document.getElementById("input2").focus(); 
   }

}

</script>
    </head>
    <body >
    cityname:
    <input type="text" name="City Name" id="input1" onblur="javascript:x();">
    <br/>
    KittyName:
<input type="text" name="Kitty Name" id="input2" onblur="javascript:x();">

    </body>
</html>
0 голосов
/ 15 июня 2011

Возможно, вам придется изменить свой способ сравнения с

document.getElementById("1").value.length==0

на

document.getElementById("1").value != ''

мне кажется, что длина всегда не равна zero

0 голосов
/ 15 июня 2011

Моя рекомендация - временно отключить обработчик blur во время выполнения обработчика другого ввода.

Я также заменил ваш HTML onblur на правильное решение Javascript, удалил пустые строки и добавил отступ для кода.

Я также изменил идентификаторы элементов, которые не могут начинаться с цифр; ваш скрипт вообще не работал бы в совместимых браузерах.

<html>
<body>

<script type="text/javascript">
window.onload = function() {
   document.getElementById("input1").onblur = x;
   document.getElementById("input2").onblur = y;
};

function x() {
   if (document.getElementById("input1").value.length == 0) {
     alert('1 is required');

     // temporarily disable binding
     document.getElementById("input2").onblur = function() {};

     document.getElementById("input1").focus();

     // re-bind
     document.getElementById("input2").onblur = y;
   }
}

function y() {
   if (document.getElementById("input2").value.length == 0) {
     alert('2 is required');

     // temporarily disable binding
     document.getElementById("input1").onblur = function() {};

     document.getElementById("input2").focus();

     // re-bind
     document.getElementById("input1").onblur = x;
   }
}
</script>

<input type="text" name="City Name" id="input1" onblur="javascript:x();">
<input type="text" name="Kitty Name" id="input2" onblur="javascript:y();">

</body>
</html>

Теперь этот скрипт довольно многословен и содержит много дублирования кода. Но в интересах сохранения темы я оставлю дальнейшие улучшения еще на один день.

Я бы также предложил не делать этого вообще; как сказал Джеймс, это раздражает .

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...