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()方法 提交表单示例相关推荐

  1. js 用submit()方法提交表单,页面闪退问题以及解决方法

    1.今天遇到一种情况,js使用submit方法提交表单,怎么都提交不过去,加断点倒跳过去了,主要实现的是这样的一个功能,点击一个按钮触发一个方法,在方法底下再提交表单过去,主要代码如下: <bu ...

  2. jquery系列之-ajaxSubmit()提交表单示例

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

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

    jquery submit()不能提交表单的解决方法 参考文章: (1)jquery submit()不能提交表单的解决方法 (2)https://www.cnblogs.com/war-hzl/p/ ...

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

    这篇文章主要介绍了jQuery使用ajaxSubmit()提交表单示例,使用延第三方插件jquery.form实现,需要的朋友可以参考下: 准备工作: ajaxSubmit(obj)方法是jQuery ...

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

    jQuery使用ajaxSubmit()提交表单示例 2014-08-26 07:42 | 9975人阅读 | 来源 ajaxSubmit(obj)方法是jQuery的一个插件jquery.form. ...

  6. jquery 上传图片 java_jquery 异步提交表单 上传图片小例子

    这次做ecshop项目用到了一些小东西,这里我就把在项目中用到的一个异步上传多个产品图片的小东西,不是多好,但是是我自己查资料搞出来的.放这里,给自己和大家一个参考,欢迎丢砖!(jquery+spri ...

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

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

  8. ajax使用pur请求怎么传参,jQuery使用ajaxSubmit()提交表单示例

    ajaxSubmit(obj)方法是jQuery的一个插件jquery.form.js里面的方法,所以使用此方法需要先引入这个插件.如下所示: 复制代码 代码如下: 那么,如何通过ajaxSubmit ...

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

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

最新文章

  1. PHP autoload机制详解
  2. (3)数据库的建立和数据表的操作
  3. 融资租赁基础干货知识大整理
  4. ubuntu mysql 防火墙_mysql、ubuntu系统防火墙常规操作
  5. 对象流 ObjectInputStream java
  6. (43)生成时钟Generated Clock简介
  7. 总结:request.setAttribute()、session.setAttribute()和request.getParameter()的联系与区别
  8. PowerDesigner 表格导出为excel
  9. SQL Server2008 错误源:.net SqlClient data provider的解决方法
  10. 微信支付 第一次成功,其他无法调起,返回-1(Android eclipse 微信支付之大坑 签名工具问题)
  11. tftp路由器刷机修复工具_魅族路由器极速版刷老毛子固件教程
  12. pythonQQ机器人系列:使用requests实现QQ机器人聊天(0-2)
  13. Kali linux 学习笔记(十三)主动信息收集——端口扫描(UDP扫描、TCP扫描) 2020.2.22
  14. 支持向量机(Vladimir Vapnik)
  15. unity--常用物理公式
  16. 联想昭阳E43L笔记本无线开关停掉解决方案
  17. 测试面试LeetCode系列:宝石与石头
  18. SpringBoot添加阿里云OOS服务
  19. RPGMV修炼手册2——RPGMV的部分窗口代码学习
  20. Linux文件删除但空间不释放问题篇

热门文章

  1. lumen php命令,php – 如何使用命令行手动运行laravel / lumen作业
  2. php 用户授权访问控制,用户权限访问控制功能
  3. echarts tooltip被遮挡_echarts 的tooltip定位到当前图,避免溢出和遮挡
  4. 深度理解java jvm,深度理解JVM
  5. python3 collections模块 tree_第30天: Python collections 模块
  6. 获取php数组最后,php获取数组最后一个值的2种方法
  7. python用turtle画小人-画一个心送给心爱的小姐姐,Python绘图库Turtle
  8. 基于Echarts+HTML5可视化数据大屏展示—大数据管理平台中心(二)
  9. 输入法画面_仙剑奇侠传X百度输入法联名纪念版皮肤今日上线
  10. web系统软件测试功能点,小程序、app、web测试的区别