jquery 通过submit()方法 提交表单示例
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>
上面的示例:仅对表单框内容进行了简单的验证,
这个验证,可以写得更详细一点。可对用户注册时,用户名是否存在进行验证。
还可以对用户名表单框失去焦点时添加事件,对用户名更详细一步的进行验证。 如:必须以字母开头。长度必须大于多少位。。。在验证的同时,也可以提示信息的文字内容进行改变,如验证出错时,文字以红色显示,验证通过时,让文字以绿色显示。
关于用户名检测与验证,本例仅给大家提供一下思路。
转载于:https://www.cnblogs.com/msidevs/p/6109602.html
jquery 通过submit()方法 提交表单示例相关推荐
- js 用submit()方法提交表单,页面闪退问题以及解决方法
1.今天遇到一种情况,js使用submit方法提交表单,怎么都提交不过去,加断点倒跳过去了,主要实现的是这样的一个功能,点击一个按钮触发一个方法,在方法底下再提交表单过去,主要代码如下: <bu ...
- jquery系列之-ajaxSubmit()提交表单示例
ajaxSubmit(obj)方法是jQuery的一个插件jquery.form.js里面的方法,所以使用此方法需要先引入这个插件.如下所示: <script src="http:// ...
- jquery submit()不能提交表单的解决方法
jquery submit()不能提交表单的解决方法 参考文章: (1)jquery submit()不能提交表单的解决方法 (2)https://www.cnblogs.com/war-hzl/p/ ...
- jQuery使用ajaxSubmit()提交表单示例(转)
这篇文章主要介绍了jQuery使用ajaxSubmit()提交表单示例,使用延第三方插件jquery.form实现,需要的朋友可以参考下: 准备工作: ajaxSubmit(obj)方法是jQuery ...
- jQuery使用ajaxSubmit()提交表单示例
jQuery使用ajaxSubmit()提交表单示例 2014-08-26 07:42 | 9975人阅读 | 来源 ajaxSubmit(obj)方法是jQuery的一个插件jquery.form. ...
- jquery 上传图片 java_jquery 异步提交表单 上传图片小例子
这次做ecshop项目用到了一些小东西,这里我就把在项目中用到的一个异步上传多个产品图片的小东西,不是多好,但是是我自己查资料搞出来的.放这里,给自己和大家一个参考,欢迎丢砖!(jquery+spri ...
- 一款基于jquery ui的动画提交表单
今天要给大家分享一款基于jquery ui的动画提交表单.这款提交表单的的效果是以动画的形式依次列表所需填写的信息.效果非常不错,效果图如下: 在线预览 源码下载 实现的代码. html代码: & ...
- ajax使用pur请求怎么传参,jQuery使用ajaxSubmit()提交表单示例
ajaxSubmit(obj)方法是jQuery的一个插件jquery.form.js里面的方法,所以使用此方法需要先引入这个插件.如下所示: 复制代码 代码如下: 那么,如何通过ajaxSubmit ...
- jQuery.Form.js 异步提交表单使用总结
jQuery.Form.js 是一个用于使用jQuery异步提交表单的插件,它使用方法简单,支持同步和异步两种方式提交. 第一步:引入jQuery与jQuery.Form.js 1 <scrip ...
最新文章
- PHP autoload机制详解
- (3)数据库的建立和数据表的操作
- 融资租赁基础干货知识大整理
- ubuntu mysql 防火墙_mysql、ubuntu系统防火墙常规操作
- 对象流 ObjectInputStream java
- (43)生成时钟Generated Clock简介
- 总结:request.setAttribute()、session.setAttribute()和request.getParameter()的联系与区别
- PowerDesigner 表格导出为excel
- SQL Server2008 错误源:.net SqlClient data provider的解决方法
- 微信支付 第一次成功,其他无法调起,返回-1(Android eclipse 微信支付之大坑 签名工具问题)
- tftp路由器刷机修复工具_魅族路由器极速版刷老毛子固件教程
- pythonQQ机器人系列:使用requests实现QQ机器人聊天(0-2)
- Kali linux 学习笔记(十三)主动信息收集——端口扫描(UDP扫描、TCP扫描) 2020.2.22
- 支持向量机(Vladimir Vapnik)
- unity--常用物理公式
- 联想昭阳E43L笔记本无线开关停掉解决方案
- 测试面试LeetCode系列:宝石与石头
- SpringBoot添加阿里云OOS服务
- RPGMV修炼手册2——RPGMV的部分窗口代码学习
- Linux文件删除但空间不释放问题篇
热门文章
- lumen php命令,php – 如何使用命令行手动运行laravel / lumen作业
- php 用户授权访问控制,用户权限访问控制功能
- echarts tooltip被遮挡_echarts 的tooltip定位到当前图,避免溢出和遮挡
- 深度理解java jvm,深度理解JVM
- python3 collections模块 tree_第30天: Python collections 模块
- 获取php数组最后,php获取数组最后一个值的2种方法
- python用turtle画小人-画一个心送给心爱的小姐姐,Python绘图库Turtle
- 基于Echarts+HTML5可视化数据大屏展示—大数据管理平台中心(二)
- 输入法画面_仙剑奇侠传X百度输入法联名纪念版皮肤今日上线
- web系统软件测试功能点,小程序、app、web测试的区别