Question

<form method="get">
    <input type="text" name="StudentID" placeholder="Ex: ZX12345"
        id="StudentID" pattern="[A-Z]{2}[0-9]{4}" required><br> <br>
    <button name="submit" type="button" value="submit"
        onclick="studentId()">Submit</button>
</form>

即使我没有提供StudentID，也使用了它甚至没有显示任何错误，并且我面临的其他问题是此处的模式不起作用。

Answer 1

使用此代码-

<form method="post">
    <input type="text" name="StudentID" placeholder="Ex: ZX12345"
        id="StudentID" pattern="[A-Z]{2}[0-9]{4}" required="required"><br> <br>
    <button name="submit" type="submit" value="submit"
        onclick="studentId()">Submit</button>
</form>

应提交按钮类型以检查输入字段。

引用this。

Answer 2

更新要提交的按钮的类型。

<button name="submit" type="submit" value="submit"
        onclick="studentId()">Submit</button>

因为表单标记始终检查必填字段为空或仅在提交时不为空。

Answer 3

您应该在输入中添加结尾斜杠并从按钮中删除类型属性

<form method="post">
    <input type="text" name="StudentID" placeholder="Ex: ZX12345"
        id="StudentID" pattern="[A-Z]{2}[0-9]{4}" required/>
    <button name="submit" onclick="studentId()">Submit</button>
</form>

这是一个演示https://codepen.io/kjagannathreddy/pen/wRYpOm

Answer 4

该问题的解决方案是在javascript方法中使用的。

event.preventDefault();

文本框留空时，要求在HTML的表单中不起作用

4 个答案: