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. ubuntu安装ANSYS17.2全过程

    本次介绍在Ubuntu kylin1604下安装Ansys 17.2的全部过程. 1 安装文件准备 关于ANSYS的软件安装文件,在网络上可以找到.这里采用SSQ版本的安装文件,如图所示,包含一个名为 ...

  2. POJ1743 Musical Theme [后缀数组]

    Musical Theme Time Limit: 1000MS   Memory Limit: 30000K Total Submissions: 27539   Accepted: 9290 De ...

  3. CSS命名规范——BEM思想(非常赞的规范)

    人们问我最多的问题之一是在CSS类名中“--”和“__”是什么意思?它们的出现是源于BEM和Nicolas Gallagher... BEM的意思就是块(block).元素(element).修饰符( ...

  4. opengl 笔记(1)

    参考<opengl入门教程>.<OpenGL之坐标转换>.<OpenGL绘制管线操作细节>等资料. 复习下留个备忘:) /*- * Opengl Demo Test ...

  5. Microsoft SQL Server中的事务与并发详解

    本篇索引: 1.事务 2.锁定和阻塞 3.隔离级别 4.死锁 一.事务 1.1 事务的概念 事务是作为单个工作单元而执行的一系列操作,比如查询和修改数据等. 事务是数据库并发控制的基本单位,一条或者一 ...

  6. TODO:Go语言同名Go字体发布

    TODO:Go语言同名Go字体发布 2016-11-16 Go语言官方博客发布了一款同名字体–Go字体.此字体族包括正常.粗体和斜体渲染,支持比例和等宽字体.此字体已经经过用于编程方面的技术测试,使用 ...

  7. Entity Framework 6 Recipes 2nd Edition(10-7)译 -> TPH继承模型中使用存储过程

    10-7. TPH继承模型中使用存储过程 问题 用一个存储过程来填充TPH继承模型的实体 解决方案 假设已有如Figure 10-7所示模型. 我们有两个派生实体: Instructor(教员)和St ...

  8. 通过扩展让ASP.NET Web API支持JSONP

    同源策略(Same Origin Policy)的存在导致了"源"自A的脚本只能操作"同源"页面的DOM,"跨源"操作来源于B的页面将会被拒 ...

  9. windows下获取IP地址的两种方法

    windows下获取IP地址的两种方法: 一种可以获取IPv4和IPv6,但是需要WSAStartup: 一种只能取到IPv4,但是不需要WSAStartup: 如下: 方法一:(可以获取IPv4和I ...

  10. Android混合开发之WebView使用总结

    前言: 今天修改项目中一个有关WebView使用的bug,激起了我总结WebView的动机,今天抽空做个总结. 混合开发相关博客: Android混合开发之WebView使用总结 Android混合开 ...