如何让表单输入工作的 JavaScript 验证

How do I get javascript validation on form input working?

本文关键字:JavaScript 验证 工作 输入 表单      更新时间:2023-09-26

只是尝试做一个简单的最大长度fName不超过10。

我一直在寻找在线示例。在我找到的任何例子中都找不到共同点。

我可以提交除空文本以外的任何内容(因为需要)

<head>
     <script type="text/javascript">
     var x = document.regoForm.fName.value;
      if (x > 1)
     {
        alert( "too big" );
        return false;
     }
  </script>
</head>
<body>
    <form name="regoForm" id="regoForm" method="post">
    </p>
    <p>
        <label for="fName">First Name</label>
        <input type="text" required placeholder="John" name="fName"
        id="fName"/>
    </p>
    <p>
        <input type="submit" value="submit">
        </p>
</form>

我向按钮添加了一个 onclick 处理程序,并将代码插入到函数中。

如果你想检查长度,而不是值,那么你应该使用.length来获取文本的长度。

试试这个

<head>
    <script type="text/javascript">
        function checkNameLength() {
            if (document.getElementById('fName').value.length > 10) {
                alert("too big");
                return false;
            }
        }
    </script>
</head>
<body>
    <form name="regoForm" id="regoForm" method="post">
        <p>
            <label for="fName">First Name</label>
            <input type="text" required placeholder="John" name="fName" id="fName"/>
        </p>
        <p>
            <input type="submit" value="submit" id="submitBtn" onclick="return checkNameLength()">
        </p>
    </form>
</body>

你应该能够使用内置的方法,如maxlength

<input type="text" maxlength="10" required placeholder="John" name="fName" id="fName"/>