Событие фокуса текстового поля jquery в бесконечном цикле

Question

Событие фокуса текстового поля jquery в бесконечном цикле

0

Я использую jquery для проверки значения текстового поля.

У меня есть 2 текстовых поля, txt1 и txt2. теперь я написал функцию jquery.

 $("#txt1").blur(function () {

            if ($("#txt1").val() == "") {
                $("#scarriername").show();
                $("#txt1").focus();
            }
            else {
                $("#scarriername").hide();
            }

        });

        $("#txt2").blur(function () {

            if ($("#txt2").val() == "") {
                $("#sscaccode").show();
                $("#txt2").focus();
            }
            else {
                $("#sscaccode").hide();
            }
        });

Теперь проблема. когда я запускаю проект. моя позиция находится на txt1, и когда вы используете Tab для перехода txt2 с нулевым или пустым значением. Фокусное событие для обоих браузеров становится зависанием из-за бесконечной циклы FOCUS.

так, как я могу справиться с этим?

Kvadiyatar 18 окт. 2013, в 13:06

Источник

1

Чего ты хочешь добиться ??? ...
Vinay Pratap Singh 18 окт. 2013, в 10:58
0

Это не бесконечный цикл, каждый раз, когда вход теряет фокус, вы говорите ему снова получить фокус, если не введено значение, так чего вы ожидаете?
adeneo 18 окт. 2013, в 11:01
0

я хочу .... предположим, что на TXT1 я не ввожу никакого значения и нажимаю клавишу Tab. я получу errormsg и мой фокус должен быть на поле txt1. вместо txt2.
Kvadiyatar 18 окт. 2013, в 11:02
1

Разве это не то, что он делает? -> jsfiddle.net/NAVss
adeneo 18 окт. 2013, в 11:04
0

@adeneo: это работа на моей стороне. почему это не работает там. это не моя проблема.
Kvadiyatar 18 окт. 2013, в 11:10

Показать ещё 3 комментария

Теги:

javascript

jquery

html

5 ответов

Ещё вопросы

Это не бесконечный цикл, каждый раз, когда вход теряет фокус, вы говорите ему снова получить фокус, если не введено значение, так чего вы ожидаете?
я хочу .... предположим, что на TXT1 я не ввожу никакого значения и нажимаю клавишу Tab. я получу errormsg и мой фокус должен быть на поле txt1. вместо txt2.
Разве это не то, что он делает? -> jsfiddle.net/NAVss
@adeneo: это работа на моей стороне. почему это не работает там. это не моя проблема.

Luca Rainone · Answer 1 · 2013-10-18T09-41-00.000Z

Вы должны вставить setTimeout, чтобы установить фокус после события blur.

Во-вторых, вы должны вставить семафор, чтобы избежать цикла (см. Код и комментарии):

var status = "valid"; // semaphore

$("#txt1").blur(function (e) {

    // if we are in programmatically focus, ignore this handler
    if(status == "invalid") 
        return ;

     if ($("#txt1").val() == "") {
         $("#scarriername").show();

         // set semaphore
         status = "invalid";

         // use setTimeout in order to set focus in the right moment
         setTimeout(function() {$("#txt1").focus(); status = "valid"},0);
     }
     else {
         $("#scarriername").hide();
     }

 });

// same as txt1
$("#txt2").blur(function () {
    if(status == "invalid") 
        return ;
    if ($("#txt2").val() == "") {
        $("#sscaccode").show();
        setTimeout(function() {$("#txt2").focus(); status = "valid"},0);

    }
    else {
        $("#sscaccode").hide();
    }
});

DEMO http://jsfiddle.net/SszUf/

xhg · Answer 2 · 2013-10-18T09-56-00.000Z

$("#txt1").blur(function () {

            if ($("#txt1").val() == "") {
                $("#scarriername").show();
                if ($("input:focus").length == 0)
                $("#txt1").focus();
            }
            else {
                $("#scarriername").hide();
            }

        });

Просто добавьте строку, чтобы решить эту проблему

Кстати, #scarriername не должно быть чем-то вроде всплывающего окна, которое вызовет другие события размытия

Вы можете проверить файл ниже:

<!doctype html>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>

<input id="txt1"><input id="txt2"><input id="txt3"><input id="txt4">
<hr>
<h1 id="h1"></h1>
</body>
<script type="text/javascript">
$(function(){
$("input").blur(function () {
 if ($(this).val() == "") {
        document.getElementById("h1").innerHTML += "123";
        $(this).focus();
    }     
});});
</script>
</html>

ты проверил эту вещь на твоей стороне? я так не думаю, это должно работать, а также я проверил это .... нет надежды ... :(
Давай, я редактирую свой ответ и загружаю свой код, просто протестируй его сейчас! Я проверил на 4 текстовое поле

Gowsikan · Answer 3 · 2013-10-18T09-52-00.000Z

Это также один из способов решения вашей проблемы при нажатии клавиши вкладок.

$("#txt1").bind('keydown',function(e)
{
    if(e.keyCode == 9)
    {
        if ($("#txt1").val() == "") {
            $("#scarriername").show();
            return false;                
        }
        else {
            $("#scarriername").hide();
        }
    }
});
$("#txt2").bind('keydown',function(e)
{
    if(e.keyCode == 9)
    {
        if ($("#txt2").val() == "") {
            $("#sscaccode").show();
            return false;
        }
        else {
            $("#sscaccode").hide();
        }
    }
});

здесь, верните ложь .... что это будет делать? ... потому что я проверяю это. ничего не происходит ..
return false предотвращает навигацию по вкладкам. таким образом, курсор останется в текущем поле ввода и не будет фокусироваться на следующем

Sr. · Answer 4 · 2013-10-18T09-20-00.000Z

Очевидно, когда вы нажимаете кнопку tab, вы вызываете событие размытия для обоих текстовых полей. С вашим кодом, когда txt1 становится размытым и не имеет содержимого, вы получаете фокус на txt1, но когда вы это делаете, вы также запускаете событие размытия для txt2, и поскольку в нем нет текста, вы возвращаете фокус обратно в txt2. Это продолжается и продолжается, фокусируясь на txt1, а затем на txt2, а затем на txt1, а затем на txt2... Вы можете поставить простую, если проверить второй обработчик события размытия, чтобы увидеть, все ли txt1 пуст, и если так держать фокус на txt1, не позволяя клиенту перейти к txt2:

 $("#txt1").blur(function () {

            if ($("#txt1").val() == "") {
                $("#scarriername").show();
                $("#txt1").focus();
            }
            else {
                $("#scarriername").hide();
            }

        });

        $("#txt2").blur(function () {

            if ($("#txt2").val() == "" && $("#txt1").val() != "") {
                $("#sscaccode").show();
                $("#txt2").focus();
            }
            else {
                $("#sscaccode").hide();
            }
        });

У меня есть более чем 20 текстовых полей ... так что, невозможно установить это условие для каждого one.possibility, пользователь может перейти с txt1 на txt5 с помощью мыши ... в то время это не будет работать.
Тогда, возможно, вы должны сделать проверку, когда пользователь пытается отправить форму. Проверьте все из них сразу.

shivam · Answer 5 · 2013-10-18T08-41-00.000Z

0

попробуй это

<input type="text" id="txt1" />
<input type="text" id="txt2" />

$("#txt2").focus(function () {
 if ($("#txt1").val() == "") {
        $("#scarriername").show();
        $("#txt1").focus();
    } 
    //alert(1);    
});

надеюсь, это поможет вам

shivam 18 окт. 2013, в 08:41

0

Нет. Это приведет к бесконечному циклу, если он добавит то же условие для фокуса txt1 также
Gowsikan 18 окт. 2013, в 11:15
0

У меня есть более чем 20 текстовых полей ... так что, невозможно установить это условие для каждого one.possibility, пользователь может перейти с txt1 на txt5 с помощью мыши ... в то время это не будет работать.
Kvadiyatar 18 окт. 2013, в 12:42