JQuQuery中最小>最大值时的实时验证输入

live validation input when min>max in jquery

本文关键字：实时验证输入最大值 JQuQuery 更新时间：2023-09-26

我想验证输入"min"和"max"并给出错误。当我按下提交按钮时，我的实际代码有效。我想在用户实时验证这一点补充其他领域。当用户转到下一个字段和最大值时

我的实际代码：

<!doctype html>
<html lang="pl">
<head>
    <meta charset="UTF-8">
    <title>...</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
</head>
<body>
<div class="error">
</div>
<form id="a" action="b.php" method="post" enctype="multipart/form-data">
    <label>
        <input type="number" name="yearMin" value="1900" min="1800" max="2299">
    </label>
    <label>
        <input type="number" name="yearMax" value="2015" min="1800" max="2299">
    </label>
    <label>
        <input type="text">
    </label>
    <button type="submit" class="button">Start</button>
</form>

<script>
    $(document).ready(
        function () {
            $("form#a").submit(
                function () {
                    var min =$('input[name^="yearMin"]').val();
                    var max =$('input[name^="yearMax"]').val();
                    if (min<max)
                    {
                        return true;
                    }
                    else
                    {
                        $('.error').text("min>max");
                        return false;
                    }
                }
            );
        }
    );
</script>

</body>
</html>

编辑：

<script>
    $("input[type=number]").on('keydown keyup',function(e) {
        var min = $('input[name^="yearMin"]').val();
        var max = $('input[name^="yearMax"]').val();
        if (min < max) {
            $('.error').text('');
            return true;
        } else {
            $('.error').text("min>max");
            return false;
        }
    });
</script>

我想对吗？text(''( 不起作用。

$("input[type=number]").on('keydown keyup',function(e) {
  var min = $('input[name^="yearMin"]').val();
  var max = $('input[name^="yearMax"]').val();
  if (min < max) {
    return true;
  } else {
    $('.error').text("min>max");
    return false;
  }
});

释放键盘键时发生键控事件。按下键盘键时发生键向下事件。因此，我们将此事件绑定到所需的元素。

键控
键控