form表单提交 type="submit"
<form action="" method="post" onsubmit="return validte()">
<div class="regist-top">
<ul class="regist-form">
<li><label for="">姓 名</label><input type="text" name="username" id="username">
<span class="error_info" id="name_error"></span>
</li>
<li><label for="">学 校</label><input type="text" name="school" id="school">
<span class="error_info" id="school_error"></span>
</li>
<li><label for="">手 机</label><input type="text" name="phonenumber" id="phonenumber">
<span class="error_info" id="phone_error"></span>
</li>
<li class="last">
<label for="">QQ</label><input type="text" name="qq" id="qq">
<span class="error_info" id="qq_error"></span>
</li>
</ul>
</div>
<div class="tc"><input type="submit" class="submit" value="离大使就差一步了,赶紧提交吧!"></div>
</form>
$(function(){
$("#username").on({
"blur":function(){username();},
"focus":function(){$("#name_error").text("");}
});
$("#school").on({
"blur":function(){school();},
"focus":function(){$("#school_error").text("");}
});
$("#phonenumber").on({
"blur":function(){phonenumber();},
"focus":function(){$("#phone_error").text("");}
});
$("#qq").on({
"blur":function(){ qq();},
"focus":function(){ $("#qq_error").text("");}
});
});
function validte(){
if(username() && school() && phonenumber() && qq()){
return true;
}else{
return false;
}
}
function username(){
var username=$("#username").val();
var testUsername = /^[\u4e00-\u9fa5a-zA-Z0-9]{3,12}$/.test(username);
if(username==""){
$("#name_error").text("姓名不能为空");
return false;
}else if (!testUsername) {
$("#name_error").text("姓名格式不正确");
return false;
}
return true;
}
function school(){
var school=$("#school").val();
if(school==""){
$("#school_error").text("学校不能为空");
return false;
}
return true;
}
function phonenumber(){
var phonenumber=$("#phonenumber").val();
var testPhonenumber=/^1[3|4|5|8][0-9]\d{8}$/.test(phonenumber);
if(phonenumber==""){
$("#phone_error").text("手机号不能为空");
return false;
}else if (!testPhonenumber) {
$("#phone_error").text("手机号格式不正确");
return false;
}
return true;
}
function qq(){
var qq=$("#qq").val();
var testQQ=/^\d{5,10}$/.test(qq);
if(qq==""){
$("#qq_error").text("qq不能为空");
return false;
}else if (!testQQ) {
$("#qq_error").text("qq格式不正确");
return false;
}
return true;
}
form表单提交 type="submit"的更多相关文章
- Form表单提交数据的几种方式
一.submit提交 在form标签中添加Action(提交的地址)和method(post),且有一个submit按钮(<input type='submit'>)就可以进行数据的提交, ...
- jQuery Form 表单提交插件-----formSerialize,fieldSerialize,fieldValue,resetForm,clearForm,clearFields的 应用
一.jQuery Form的其他api 1. formSerialize 将表单序列化成查询串.这个方法将返回一个形如: name1=value1&name2=value2的字符串.是否可 ...
- jQuery Form 表单提交插件----Form 简介,官方文档,官方下载地址
一.jQuery Form简介 jQuery Form插件是一个优秀的Ajax表单插件,可以非常容易地.无侵入地升级HTML表单以支持Ajax.jQuery Form有两个核心方法 -- ajaxF ...
- form表单提交
1.form表单提交.html页面失败 <%--客户端form--%> <form id="form2" action="LoginOne.html&q ...
- ajax form表单提交 input file中的文件
ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...
- 2017-01-11小程序form表单提交
小程序form表单提交 1.小程序相对于之前的WEB+PHP建站来说,个人理解为只是将web放到了微信端,用小程序固定的格式前前端进行布局.事件触发和数据的输送和读取,服务器端可以用任何后端语言写,但 ...
- SpringMVC中使用bean来接收form表单提交的参数时的注意点
这是前辈们对于SpringMVC接收表单数据记录下来的总结经验: SpringMVC接收页面表单参数 springmvc请求参数获取的几种方法 下面是我自己在使用时发现的,前辈们没有记录的细节和注意点 ...
- Form表单提交,Ajax请求,$http请求的区别
做过前端同学想必都避免不了要和后台server打交道.而以下这三种与后台交互的方式想必大家都不陌生. Form表单提交,Ajax请求,Angular的$http请求 以前一直搞不清楚什么时候应该用哪种 ...
- js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题
js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题 js模拟form表单提交数据源码: /** * js模拟form表单提交 * @param ...
随机推荐
- 静态类(static)与java值传递、引用传递小测
java中都是值传递.直接上代码了: class TestStaticA { static { System.out.println("b"); } public TestStat ...
- HTTP与HTTPS对访问速度(性能)的影响【转】
1 前言 HTTPS 在保护用户隐私,防止流量劫持方面发挥着非常关键的作用,但与此同时,HTTPS 也会降低用户访问速度,增加网站服务器的计算资源消耗. 本文主要介绍 https 对用户体验的影响. ...
- poj2752seek the name, seek the fame【kmp】
The little cat is so famous, that many couples tramp over hill and dale to Byteland, and asked the l ...
- 计蒜客 31459 - Trace - [线段树][2018ICPC徐州网络预赛G题]
题目链接:https://nanti.jisuanke.com/t/31459 样例输入 3 1 4 4 1 3 3 样例输出 10 题意: 二维平面上给出 $n$ 个点,每个点坐标 $\left( ...
- 关于graham扫描法求凸包的小记
1.首先,凸包是啥: 若是在二维平面上,则一般的,给定二维平面上的点集,凸包就是将最外层的点连接起来构成的凸多边型,它能包含点集中所有的点. ───────────────────────────── ...
- POJ 3522 - Slim Span - [kruskal求MST]
题目链接:http://poj.org/problem?id=3522 Time Limit: 5000MS Memory Limit: 65536K Description Given an und ...
- PHP漏洞
http://os.51cto.com/art/201204/328766.htm 针对PHP的网站主要存在下面几种攻击方式: 1.命令注入(Command Injection) 2.eval注入(E ...
- 2018/03/10 每日一个Linux命令 之 find
每日一个Linux命令 2018-03-10 Linux 命令 find find [查找目录] [定义条件] 今天很累了,本来不想写了,但想到自己订的学习计划必须坚持下去,每天完成. fin ...
- 2015 湘潭大学程序设计比赛(Internet)--G题-人生成就
人生成就 Accepted : 54 Submit : 104 Time Limit : 10000 MS Memory Limit : 65536 KB 题目描述 人生就像一个n*n的矩阵, ...
- css 计算属性 calc的使用
宽度等于父元素的宽度减去16像素 高度等于父元素的高度减去16像素 注意:100%和16px 与减号之间必须有空格,否则高度会失效!!!! .box{ width:calc(100% - 16px ...