jquery插件制作 表单验证实现代码
176 浏览量
2020-10-27
23:45:17
上传
评论
收藏 40KB PDF 举报
jquery插件制作插件制作 表单验证实现代码表单验证实现代码
今天的内容是关于表单验证插件的制作。表单验证控件实现的主要功能是，当表单提交的时候检查必填项是否
正确填写，同时根据需要验证输入信息是否符合规范
先下页面代码：
复制代码 代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript" src="Scripts/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="Scripts/jquery.formCheck.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$('.formToCheck').formCheck();
});
</script>
<style type="text/css">
form
{
width: 300px;
}
label
{
position: absolute;
}
input:not(.submit), textarea
{
margin-left: 100px;
width: 200px;
}
.submit
{
margin-left: 100px;
}
.error
{
border:1px solid red;
}
</style>
</head>
<body>
<form class="formToCheck" id="formToCheck" method="get" action="#">
<fieldset>
<legend>a simple form</legend>
<p>
<label for="fname">
* first name</label>
<input id="fname" class="required" name="fname" />
</p>
<p>
<label for="lname">
last name</label>
<input id="lname" name="lname" />
</p>
<p>
<label for="email">
* email</label>
<input id="email" name="email" class="required email" />
</p>
<p>
<label for="comment">
* comment</label>
<input id="comment" name="comment" class="required" />
资源评论
