HTML 表单验证可经过 JavaScript 来完成。
假如某个表单字段(fname)的值是否空值,如果是空值,就会弹出一条信息:
function validateForm() {
var x = document.forms["myForm"]["fname"].value;
if (x == null || x == "") {
alert("输入你的名字。");
return false;
}
以上 JavaScript 代码能够经过 HTML 在表单提交时被调用:
<form name="myForm" action="pkdemo_form.php" onsubmit="return validateForm()" method="post">
名称: <input type="text" name="fname">
<input type="submit" value="确认提交">
</form>
JavaScript 通常用于对输入的数字验证:
请输入 1 到 10 之间的数字:
HTML 表单验证也能够经过浏览器来自动完成。
假如表单字段(fname)是空值,required 属性会制止表单提交:
<form action="pkdemo_form.php" method="post">
<input type="text" name="fname" required="required">
HTML 表单自动验证 Internet Explorer 9 、IE 的浏览器和之前老版本不支持表单自动验证。
数据验证指的是确保正确和用户输入的是否正确。
典型的有效数据验证:
确认字段是没有输入?
确认用户是否输入了有效格式?
确认在数字字段是否输入了文本?
在无数环境下,数据验证的用途是确保精确的用户输入。
数据验证能够运用不同办法来定义,并经过多种方发来调用。
服务端验证是由web服务器执行的数据提交到服务器上后再验证。
客户端验证是由 web 浏览器执行输入的 web 服务器传送之前。
HTML5 新增加了 HTML 表单的验证概念:约束验证为(constraint validation)。
HTML 约束验证基于:
基于 HTML 输入属性
基于 CSS 伪类选择器
基于 DOM 属性和方法
查看完整列表,详情查看 HTML 输入属性。
查看完整列表,详情查看 CSS 伪类