Предупреждающие сообщения Javascript в бесконечном цикле

Question

Боксы предупреждений в бесконечном цикле, здесь я пытаюсь поместить всплывающее предупреждающее сообщение на 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();">

Answer 1

Вместо обработки в событии onblur() вы можете обрабатывать его в событии onchange().

Если вы все еще хотите использовать onblur(), используйте фокус внутри setTimeout, как показано ниже.

alert('2 is required');
setTimeout(function() { document.getElementById("2").focus(); }, 100); 

Answer 2

Существует фундаментальная проблема при попытке изменить фокус на поле на onblur, когда оно недопустимо.Если пользователь решает уйти, он просто не может.Когда они щелкают вдали от поля, их насильно забирают обратно.Я видел случаи, когда пользователь был вынужден прекратить сеанс браузера, просто чтобы избежать чрезмерной проверки onblur.

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

Я рекомендую вам выделить поле как недействительное в некотором смысле на onblur.Например, поместите звездочку рядом с ней, выделите ее красным и т. Д. Таким образом, вы можете обойтись без alert, и у пользователя все еще есть контроль.

Когда пользователь приходит, чтобы отправить форму, вы выполняете свой клиент-затем проверяет сторону и показывает предупреждение (см. ответ @Phill Sacre)

Answer 3

Мое предложение: объедините свою проверку в один метод и проверьте каждый в нем последовательно.

Итак (псевдокод):

function validate() {
     for (field in fieldlist) {
         if (document.getElementById(field).value.length == 0) {
              displayerror();
              document.getElementById(field).focus();
         }
     }
}

Таким образом, вы когда-либо будете отображать только одиношибка за раз.

Answer 4

Используя таймауты, вы можете отключить событие onBlur для элемента target и вернуться к элементу source. Это работает в IE.

function focusWithoutEvents(object) {
    // Small timeout so that the active element will be the "next" element
    setTimeout(function() {
        var activeElement = document.activeElement;

        // Save the current onblur()
        var activeOnblur = activeElement.onblur;

        // Disable the onblur event
        activeElement.onblur = null;

        // Now we can focus without triggering onblur event
        object.focus();

        // With a small delay, put back the onblur code.
        setTimeout(function() {
            activeElement.onblur = activeOnblur
        }, 100);
    }, 100);
}

Answer 5

Я думаю, что это будет работать для вас:

for(;;) {
    alert("I am a looping alert box!");
}

Примечание:
for(;;) помогает лучше. Потому что если вы сделаете for(i=0; i<Infinity; i++) и alert("Number #"+i); покажет номер № 0, то номер № 1, затем номер № 2 и в конечном итоге номер № 1073841824.
Кстати: поставьте var i = 2 и каждый раз будет отображаться номер 2. И, кстати, на сайте JavaScript JSLint Checker было сказано, что я не должен помещать var variable name = answer в циклы

Answer 6

Попробуйте ниже Js Code.Это решит вашу проблему.

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


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

Answer 7

У меня есть один JS и есть одна функция, которая называется onblur событие текстового поля и onblur это событие находится в бесконечном цикле.

После этого я объявил одну глобальную переменную (наверхуJS и вне функции Var Isvalid = true;)

В функции Выполнение кода проверки.

if (IsValid == true)
{   
    if validation is false.
    giving alert message.
    and updating the IsValid = false;
}

Если проверка истинна, обновите глобальную переменную.Isvalid = true;

Во второй рекурсии он не будет выполнять цикл.Если в следующей фазе произошло размытие, переменная автоматически устанавливается на True.

Answer 8

другой код

common.js

if( window.COMMON_JS == undefined ){
    window.COMMON_JS = "common.js ver:1.0.0.1";

    window.AletMessage = "";
    MessageAlert = function( msg ){
        if( window.AletMessage == msg  ){
            return;
        }
        window.AletMessage = msg;
        alert(msg);
        setTimeout(function(){
            window.AletMessage = "";    
        },1000);
    };
}

test.html

<html>
<head>
<script type="text/javascript" src="common.js"></script>
<script>
var e = function( _id ){
    return document.getElementById(_id);
};
window.onload = function(){
    e("test").onblur = function(){
        if( e("test").value != "11" ){
            MessageAlert("Number[11] is only allow");
            e("test").focus();
        }
    };
};
</script>
</head>
<body>
    <p>Only 11 allowed.</p>
    <input type="text" id="test"/>
</body>
</html>

Answer 9

Если вы измените свой код следующим образом.Это может быть решено.

<html>
<head>
<title>break alert infinite loop </title>
<script>
var e = function( _id ){
    return document.getElementById(_id);
};
window.onload = function(){
    e("test").onblur = function(){
        if( e("test").value != "11" ){
            Msg("Number[11] is only allow");
            e("test").focus();
        }
    };
};

/* fix start */
var beforeMsg = "";
/* fix end */

function Msg( msg ){
    /* fix start */
    if( msg == beforeMsg ){
        return;
    }
    beforeMsg = msg;
    /* fix end */

    alert(msg);

    /* fix start */
    setTimeout(function(){
        beforeMsg = "";
    },1000);
    /* fix end */
}

</script>
</head>
<body>
    <p>only 11 is allow</p>
    <input type="text" id="test"/>
</body>
</html>

Answer 10

Вот мое решение:

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

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

Итак, если требуется 1, функция y не будет оцениваться