jquery 通过submit()方法 提交表单示例：


本示例：以用户注册作为例子。使用jquery中的submit()方法实现表单提交。

注：本示例仅提供了对表单的验证，本例只用选用了三个字段作为测试。

用户点击提交按钮时，触发点击事件，会执行所有表单框的验证，如通过验证，则执行submit()方法，对表单内容进行提交。

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title>用户注册</title>

<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>

<script>

$(function(){

$('#register').click(function(){

var name=$('#name').val();

var pass=$('#pass').val();

var phone=$('#phone').val();

if(name==''){

alert('用户名不能为空');

return false;

}else if(pass==''){

alert('密码不能为空。');

return false;

}else if(phone==''){

alert('手机号码不能为空');

return false;

}else if(phone!=''){

var reg=/^1[3458]\d{9}$/;

if(!reg.test(phone)){

alert('手机号码格式不正确');

return false;

}

}else{

$('form').submit();

}

})

})

</script>

</head>

<body>

<form name="myform" method="post" action="__URL__/register">

<input type="text" name="name" value="" id="name"/>

<input type="password" name="pass" value="" id="pass" />

<input type="text" name="phone" value="" id="phone" />

<input type="submit" name="" value="用户注册" id="register" />

</form>

</body>

</html>

 上面的示例：仅对表单框内容进行了简单的验证，

 这个验证，可以写得更详细一点。可对用户注册时，用户名是否存在进行验证。

 还可以对用户名表单框失去焦点时添加事件，对用户名更详细一步的进行验证。 如：必须以字母开头。长度必须大于多少位。。。在验证的同时，也可以提示信息的文字内容进行改变，如验证出错时，文字以红色显示，验证通过时，让文字以绿色显示。

  关于用户名检测与验证，本例仅给大家提供一下思路。

jquery 通过submit()方法 提交表单示例的更多相关文章

  1. jquery中$.ajax方法提交表单

    function postdata(){                        //提交数据函数 $.ajax({                                //调用jqu ...

  2. 一款基于jquery ui的动画提交表单

    今天要给大家分享一款基于jquery ui的动画提交表单.这款提交表单的的效果是以动画的形式依次列表所需填写的信息.效果非常不错,效果图如下: 在线预览   源码下载 实现的代码. html代码: & ...

  3. jquery submit()不能提交表单的解决方法

    <form id="form" method="get"> <input type="text" name="q ...

  4. jQuery使用ajaxSubmit()提交表单示例

    ajaxSubmit(obj)方法是jQuery的一个插件jquery.form.js里面的方法,所以使用此方法需要先引入这个插件.如下所示:   代码如下: <script src=" ...

  5. jQuery.Form.js 异步提交表单使用总结

    jQuery.Form.js 是一个用于使用jQuery异步提交表单的插件,它使用方法简单,支持同步和异步两种方式提交. 第一步:引入jQuery与jQuery.Form.js <script ...

  6. jquery来跨域提交表单

    说说用jquery来实现跨域提交表单 在jQuery中,我们使用json数据类型,通过getJSON方法来实现从服务端获取或发送数据,而当要向不同远程服务器端提交或者获取数据时,要采用jsonp数据类 ...

  7. 使用jQuery实现跨域提交表单数据

    我们在WEB开发中有时会遇到这种情况,比如要从A网站收集用户信息,提交给B网站处理,这个时候就会涉及到跨域提交数据的问题.本文将给您介绍如何使用jQuery来实现异步跨域提交表单数据.   在jQue ...

  8. jQuery实现button按钮提交表单

    在JSP页面中,通常使用button按钮提交表单数据,使用jQuery实现代码如下: <span style="font-family:Comic Sans MS;font-size: ...

  9. 关于form.submit()不能提交表单的错误原因

    来源:http://www.ido321.com/948.html 直接上代码把: 1: <div id="register"> 2: <h4>会员注冊&l ...

随机推荐

  1. iOS开源项目周报1215

    由OpenDigg 出品的iOS开源项目周报第一期来啦.我们的iOS开源周报集合了OpenDigg一周来新收录的优质的iOS开发方面的开源项目,方便iOS开发人员便捷的找到自己需要的项目工具等. PY ...

  2. Selenium-java-获取当前时间

    1 获取当前时间 // 获取当前时分秒 Calendar now = Calendar.getInstance(); int is = now.get(Calendar.HOUR_OF_DAY); i ...

  3. 【道德经】漫谈实体、对象、DTO及AutoMapper的使用

    写在前面 实体和值对象 实体和对象 故常无欲以观其妙,常有欲以观其徼 初始实体和演化实体 代码中的DTO AutoMapper实体转换 后记 实体(Entity).对象(Object).DTO(Dat ...

  4. JavaScript之web通信

    web通信,一个特别大的topic,涉及面也是很广的.因最近学习了 javascript 中一些 web 通信知识,在这里总结下.文中应该会有理解错误或者表述不清晰的地方,还望斧正! 一.前言 1. ...

  5. C++ std::list

    std::list template < class T, class Alloc = allocator > class list; List Lists are sequence co ...

  6. ubuntu 启动MySql和安装python的MySQLdb模块

    ubuntu一般会自己预安装mysql,你只需 /etc/init.d/mysql start|stop|restart|reload|force-reload|status  命令便可以实现mysq ...

  7. 浅析Java 泛型

    泛型是JavaSE5引入的一个新概念,但是这个概念在编程语言中却是很普遍的一个概念.下面,根据以下内容,我们总结下在Java中使用泛型. 泛型使用的意义 什么是泛型 泛型类 泛型方法 泛型接口 泛型擦 ...

  8. Spring的前期配置

    1创建一个java项目,鼠标单击项目右键新建一个名为lib的文件夹 2在lib文件夹中考入Spring需要的配置文件(俗称jar包) 3 按Shift选中这些jar右键添加至构建路径 4选中src目录 ...

  9. ASP.NET MVC Bundle使用 合并压缩

    2017-01-06 更新 在 BundleCollection 的构造函数中添加了 3种默认规则 public BundleCollection() { BundleCollection.AddDe ...

  10. tornado session

    [转]tornado入门 - session cookie 和session 的区别: 1.cookie数据存放在客户的浏览器上,session数据放在服务器上. 2.cookie不是很安全,别人可以 ...