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. JavaScript基础

    JavaScript基础 JavaScript是一门编程语言,浏览器内置了JavaScript语言的解释器,所以在浏览器上按照JavaScript语言的规则编写相应代码之,浏览器可以解释并做出相应的处 ...

  2. jira的插件开发流程实践

    怎么开头呢,由于自己比较懒,博客一直不怎么弄,以后克己一点,多传点自己遇到的问题和经历上来,供自己以后记忆,也供需要的小伙伴少走点弯路吧 最近公司项目需要竞标一个运维项目,甲方给予了既定的几种比较常用 ...

  3. 敏捷转型历程 - Sprint3 一团糟的演示会

    我: Tech Leader 团队:团队成员分布在两个城市,我所在的城市包括我有4个成员,另外一个城市包括SM有7个成员.另外由于我们的BA离职了,我暂代IT 的PO 职位.PM和我在一个城市,但他不 ...

  4. [Django]用户权限学习系列之Permission权限基本操作指令

    若需建立py文件进行测试,则在文件开始加入以下代码即可 #coding:utf-8 import os os.environ.setdefault("DJANGO_SETTINGS_MODU ...

  5. 将css和js缓存到localStorage缓存,提高网页响应速度

    适用于小站点,这很极致,很快速~~ /** * Created by SevenNight on 2016/9/21 0021. * 插件功能:使用localStorage缓存js和css文件,减少h ...

  6. 豪情-CSS解构系列之-新浪页面解构-01

    目录: 一. 新浪的布局特点 二. 内容细节的特点 三. 其中相关的一些基础技术点 1. 常见布局方法 2. 布局要点 3. Debugger误区 4.列表 5.字体颜色 6.CSS选择符 7.CSS ...

  7. 2、利用蓝牙定位及姿态识别实现一个智能篮球场套件(二)——CC2540/CC2541基于广播的RSSI获得

    CC2541一拖多例程中RSSI获得是通过一个事件回调函数实现的,前提是需要连接上蓝牙设备. 这个对于多点定位来说是不可行的,由于主机搜索蓝牙设备过程中也能获得当前蓝牙设备的RSSI等信息,因此可基于 ...

  8. The type javax.ws.rs.core.MediaType cannot be resolved. It is indirectly referenced from required .class files

    看到了http://stackoverflow.com/questions/5547162/eclipse-error-indirectly-referenced-from-required-clas ...

  9. esayui

  10. iOS-推送,证书申请,本地推送

    介绍一点点背景资料 众所周知,使用推送通知是一个很棒的.给应用添加实时消息通知的方式.这样做的结局是,开发者和用户之间,彼此永远保持着一种令人愉悦的亲密关系. 然而不幸的是,iOS的推送通知并非那么容 ...