Question

对我来说，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>

Answer 1

当 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);
    }
}

Answer 2

你需要在场的聚焦上设置一点延迟。

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来验证输入。这很烦人，它产生无尽的警报。验证表单onsubmit事件。

Answer 3

自您发布问题以来，我使用不同的技术对您的问题进行了一小时的实验。在我看来，通过输入事件，您无法将注意力集中在自身上。

尽管如此，还有另一种可能的解决方法。您可以在提交表单时致电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>

希望有帮助...

和平在你身上......

如何让javascript focus（）方法在输入文本框的onBlur事件中工作？

3 个答案: