<form id="myForm" action="http://www.365mini.com" method="post">
<input id="name" name="name" type="text" value="CodePlayer" /><br>
<input id="age" name="age" type="text" value="" /><br>
<input type="submit" value="提交" />
</form>
<div id="msg"></div>
$("form").submit( function(event){
if( !$("#name").val() ){
alert("姓名不能为空!");
return false; // 返回值为false,将阻止表单提交
}else if( !$("#age").val() ){
alert("年龄不能为空!");
return false; // 返回值为false,将阻止表单提交
}
} );

function check(s) {
return (s == null || typeof (s) == "undefined" || s == "");
}


//去掉前后空格
function trim(s) {
return s.replace(/(^\s*)|(\s*$)/g, "");
}

 

提交表单之前校验,要先引入jquery



<form action="login.do" method="post" id="myform">
<fieldset>
<div class="form-group">
<input type="text" placeholder="用户名" name="loginName"
id="loginName">
</div>
<div class="form-group">
<input type="password" placeholder="密码" name="loginPassword"
id="loginPassword">
</div>
<button type="submit" id="submit">登录</button>
</fieldset>
</form>
$("#submit").click(function() {
// alert(111133);
//$("#myform").submit();
var userName = $("#loginName").val();
var passWord = $("#loginPassword").val();
if (check($.trim(userName))) {
alert("请输入用户名");
return false;
}
if (check($.trim(passWord))) {
alert("请输入密码");
return false;
}
return true;
})

form表单提交校验的更多相关文章

  1. jQuery Form 表单提交插件----Form 简介,官方文档,官方下载地址

     一.jQuery Form简介 jQuery Form插件是一个优秀的Ajax表单插件,可以非常容易地.无侵入地升级HTML表单以支持Ajax.jQuery Form有两个核心方法 -- ajaxF ...

  2. ajax form表单提交 input file中的文件

    ajax form表单提交 input file中的文件 现今的主流浏览器由于ajax提交form表单无法把文件类型数据提交到后台,供后台处理,可是开发中由于某些原因又不得不用ajax提交文件, 为了 ...

  3. jQuery判断 form表单提交时一些文本框的判断

    一: form表单提交时如果表单里有input标签为空那么不提交form表单. <head> <script type="text/javascript"> ...

  4. Form表单提交数据的几种方式

    一.submit提交 在form标签中添加Action(提交的地址)和method(post),且有一个submit按钮(<input type='submit'>)就可以进行数据的提交, ...

  5. jQuery Form 表单提交插件-----formSerialize,fieldSerialize,fieldValue,resetForm,clearForm,clearFields的 应用

    一.jQuery Form的其他api  1.  formSerialize 将表单序列化成查询串.这个方法将返回一个形如: name1=value1&name2=value2的字符串.是否可 ...

  6. Checkbox框全选操作,form表单提交与jquery ajax提交两种处理方式

    //1.jquery ajax<script type="text/javascript"> $(function(){ var basePath = $(" ...

  7. form表单提交

    1.form表单提交.html页面失败 <%--客户端form--%> <form id="form2" action="LoginOne.html&q ...

  8. 2017-01-11小程序form表单提交

    小程序form表单提交 1.小程序相对于之前的WEB+PHP建站来说,个人理解为只是将web放到了微信端,用小程序固定的格式前前端进行布局.事件触发和数据的输送和读取,服务器端可以用任何后端语言写,但 ...

  9. SpringMVC中使用bean来接收form表单提交的参数时的注意点

    这是前辈们对于SpringMVC接收表单数据记录下来的总结经验: SpringMVC接收页面表单参数 springmvc请求参数获取的几种方法 下面是我自己在使用时发现的,前辈们没有记录的细节和注意点 ...

随机推荐

  1. CSS 定位元素之 relative

    1. relative 和 absolute relative 会限制 absolute. absolute 会根据 父级的的定位元素来定位. 2. overflow 和 absolue 当overf ...

  2. My way to Python - Day012 - 消息中间件

    消息中间件介绍 消息中间件的概念 消息中间件是在消息传输过程中保存消息的容器.消息中间件在将消息从它的源中继到它的目标时充当中间人的作用.队列的主要作用是提供路由并保证消息的传递:如果发生消息接收者不 ...

  3. .net的WebForm模拟MVC进行模型绑定,让自己少操劳

    一.前言 用过MVC的兄弟们都知道,MVC有模型绑定表单提交的数据功能,那么我也想偷个懒也写个WebForm版的模型绑定.这里主要定义一个泛型方法,然后通过反射把表单上对应属性名字的值赋值到反射创建类 ...

  4. HTMl5的sessionStorage和localStorage(转)

    html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage. sessionStorage用于本地存储一个会话(session)中的数据,这些数据只 ...

  5. Linux命令:TOP

    top命令 是Linux下常用的性能 分析工具 ,能够实时显示系统 中各个进程的资源占用状况,类似于Windows的任务管理 器.下面详细介绍它的使用方法. top - 02:53:32 up 16 ...

  6. ios--图片处理(修改、保存)UIGraphicsBeginImageContext

    http://www.th7.cn/Program/IOS/201407/250904.shtml

  7. C#检测串口被拔掉等一些触发事件合集

    // //设备异常重载 // protected override void WndProc(ref Message m) { if (m.Msg == 0x0219) {//设备被拔出 if (m. ...

  8. 【android】android中activity的生命周期

    activity生命周期: 实例代码: public class DemoActivity extends Activity { //1.activity第一次被创建的时候,执行 @Override ...

  9. Gora官方文档之二:Gora对Map-Reduce的支持

    参考官方文档:http://gora.apache.org/current/tutorial.html 项目代码见:https://code.csdn.net/jediael_lu/mygoradem ...

  10. 【面试】Spring问答Top 25

    本文由 ImportNew - 一直在路上 翻译自 howtodoinjava.欢迎加入翻译小组.转载请见文末要求. 本人收集了一些在大家在面试时被经常问及的关于Spring的主要问题,这些问题有可能 ...