js实现编辑框用户名密码日期选择按钮提交特效代码

最新推荐文章于 2022-08-18 16:56:19 发布

智欣悦

最新推荐文章于 2022-08-18 16:56:19 发布

阅读量374

点赞数

分类专栏： js

本文链接：https://blog.csdn.net/zxllynu/article/details/76725265

版权

js 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
input[type='text'],
input[type='password']{width: 150px; height: 20px; line-height: 20px;margin-top: 20px;}
select{height: 20px;margin-top: 20px;}
input[type='submit']{width: 120px; height: 30px; margin-top: 30px;}
</style>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<script type="text/javascript">
$(function(){
var phone=$("[name='phone']").val();
var patphone=/0[0~9]{3}-[0-9]{7,8}/;
var email=$("[name='email']").val();
var patemail=/^\w+@\w+(\.[a-zA-Z]{2,3}){1,2}$/;

$("#form1").submit(function(){
var name=$("[name='name']").val();
if (name==null||$.trim(name)=="") {
alert("必须输入用户名");
return false;
}

if (!patemail.test(email)) {
alert('邮件格式不合法')；
return false;
}

return true;
});
});
</script>
</head>
<body>
<form action="1.html" method="get" id="form1">
用户名:<input type="text" name="name"></input><br>
密码：<input type="password" name="pwd"></input><br>
电话：<input type="text" name="phone"></input>
邮箱：<input type="text" name="email"></input>
生日：<select>
<option name="year" value="1994">1994</option>
<option name="year" value="1993">1993</option>
<option name="year" value="1992">1992</option>
</select>
<select>
<option name="month" value="01">01</option>
<option name="month" value="02">02</option>
<option name="month" value="03">03</option>
</select>
<select>
<option name="day" value="11">11</option>
<option name="day" value="12">12</option>
<option name="day" value="13">13</option>
</select><br>

<input type="submit" value="提交"></input>
</form>

</body>
</html>