Question

我有一个带有文本输入的表单。我希望能够检查其中一些输入，如果值无效，我想将焦点保持在该输入内，直到用户将其更改为有效值。我的问题是，在onblur我添加了焦点，但直到发生这种情况，焦点转移到另一个字段，然后另一个字段变得模糊，我进入循环...

如何在不触发下一个输入onblur的情况下保持第一个输入？

感谢提前。

Answer 1

不是将字段绑定到.blur()尝试使用.change()，而是应该有助于防止循环发生。

$(".someField").change(function(e) {
    var $test = $(this).css("background-color", "");
    if ($test.val() != "Jon") {
        setTimeout(function() {
            $test.css("background-color", "red").focus();
        }, 0);
    }
});

jsfiddle上的代码示例。

在chrome，firefox和IE8的最新开发频道中测试

Answer 2

这应该会让你走上正轨：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript">
            var lastElement = null;
            var isValid = false;

            $(document).ready(function() {

                $('.validated').blur(function(e) {
                    // validate your input here
                    isValid = false;
                    lastElement = e.target;
                }).click(function(e) {
                    e.preventDefault();
                    if(!isValid) $(lastElement).focus();
                });

            });

        </script>
    </head>
    <body>
        <input class="validated" name="foo" type="text" /><br />
        <input class="validated" name="bar" type="text" /><br />
    </body>
</html>

在Firefox 4 Beta 12中测试过并且有效。希望这会有所帮助。

当值无效时，如何使用输入控件保持焦点

2 个答案: