Как заставить javascript focus () работать в событии onBlur для текстового поля ввода? - PullRequest
6 голосов
/ 27 марта 2012

для меня javascript focus () метод работает нормально, если я использую его с кнопкой и событием onClick, но с onBlur из текстового поля он не работает. Кто-нибудь может мне помочь?

<html>
<head>
<script type="text/javascript">
function displayResult()
{
var inp1=document.getElementById("text1").value;
var inp2=inp1.length;
if(inp2==0)
{
alert("Field 1 cannot be left Empty");
//document.getElementById("text1").value="";
document.getElementById("text1").focus();
}
}
</script>
</head>
<body>
<input type="text" name="text1" id="text1" onBlur="displayResult();"/>
<input type="text" name="yext2" id="text2" />


</body>
</html>

Ответы [ 3 ]

3 голосов
/ 27 марта 2012

Невозможно повторно применить фокус к элементу, когда срабатывает его событие blur .Используйте таймер со значением интервала 0, чтобы задержать вызов для фокусировки до следующего:

function displayResult() {
    var inp1 = document.getElementById("text1").value,
        inp2 = inp1.length;

    if(inp2==0) {
        alert("Field 1 cannot be left Empty");
        //document.getElementById("text1").value="";

        window.setTimeout(function () { 
            document.getElementById("text1").focus();
        }, 0);
    }
}
2 голосов
/ 27 марта 2012

Вам необходимо установить небольшую задержку при фокусировке поля.

setTimeout (function () {field.focus ()}, 10);

подобно:

<html>
<head>
<script type="text/javascript">
function displayResult(obj)
{
  var inp1=obj.value;
  var inp2=inp1.length;
  if(inp2==0)
  {
    alert("Field 1 cannot be left Empty");
    setTimeout(function(){obj.focus()}, 10);
  }
}
</script>
</head>
<body>
<form>
<input type="text" name="text1" id="text1" onblur="displayResult(this);"/>
<input type="text" name="yext2" id="text2" />
<input type="submit">
</form>
</body>
</html>

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

1 голос
/ 27 марта 2012

С тех пор, как вы опубликовали вопрос, я экспериментировал с ним в течение часа, используя различные методы.Теперь мне кажется, что через событие на входе вы не можете сосредоточиться на себе.

Тем не менее, есть еще один возможный обходной путь.Вы можете позвонить displayResult() при отправке формы, проверить, пуста ли text1, и отменить отправку, если она пуста, и установить фокус на text1.Я переписал код для вас.

<html>
<head>
<script type="text/javascript">
function displayResult()
{
var inp1=document.getElementById("text1").value;
var inp2=inp1.length;
if(inp2==0)
{
alert("Field 1 cannot be left Empty");
document.getElementById("text1").focus();
return false;
}
}
</script>
</head>
<body>
<form onsubmit="return displayResult();">
<input type="text" name="text1" id="text1" />
<input type="text" name="yext2" id="text2" />
<input type="submit"  />
</form>

</body>
</html>

Надеюсь, это поможет ...

Мир вам ...

...