文档章节

非跳转当页ajax验证表单提示

鱼鱼鱼鱼yu
 鱼鱼鱼鱼yu
发布于 2015/03/31 11:55
字数 276
阅读 30
收藏 3

效果图:

点击提交时触发事件验证表单数据

 

1.在提交时增加一个方法,在form增加 onsubmit="return submitPwdInfo();"提交时触发submitPwdInfo

2.在submitPwdInfo中增加验证逻辑

 

/* *
 * 会员找回密码时,对输入作处理
 * ajax的参数async:false, 设置为false,即同步请求,在这里可以简单理解为等到有返回值ajax才会继续执行下,
 * 先声明一个变量flag,然后根据执行结果赋予flag值,最后返回flag即可
 */
 function submitPwdInfo(){
	 var flag = true;
	 var myreg = /^([\.a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(\.[a-zA-Z0-9_-])+/;
	 
	 var email = $('#email').val();
	 var captcha = $('#captcha').val();
	 
	 $.ajax({
         type:'post',
         async: false,
         url:"{:U('User/resetPass')}",
         //cache:false,
         data:'email='+email+'&captcha='+captcha,
         success:function(data){
        	 if (email == ''){
                 $('#info').text(msg_email_blank);
                 flag = false;
             } else if (captcha == ''){
                 $('#captchaInfo').text(msg_captcha_blank);
                 flag = false;
             } else if (!myreg.test(email)) {
                 $('#info').text(msg_email_format);
                 flag = false;
             } else if(data.status !== 3){
            	 $('#info').text(data.info);
            	 flag = false;
             } else if (data.status == 3) {
            	alert(data.info);
            	 flag = true;
             }
         }
     });
	 return flag; 
}

3.验证完成

© 著作权归作者所有

共有 人打赏支持
鱼鱼鱼鱼yu
粉丝 10
博文 22
码字总数 9557
作品 0
深圳
私信 提问
简单易用的表单验证插件Validform - 一行代码搞定整站的表单验证!

官方网址:validform.rjboy.cn Validform:一行代码搞定整站的表单验证! 为什么能如此方便?插件的核心思想就是把所有的验证条件及验证提示信息绑定到每个表单元素,让验证代码在执行时只是...

haiercdboy
2012/03/22
0
0
表单提交报错Request method 'POST' not supported

最近写一个spring的项目遇到一个报错,迟迟不能解决。我用jQuery提交表单进行登录的时候。一直提示Request method 'POST' not supported这个报错。但是我这个项目在前几天部署的时候。并没有...

怒摘一板
2017/03/31
1K
4
form表单提交的几种方法

在form标签中添加Action(提交的地址)和method(post),且有一个submit按钮 ()就可以进行数据的提交,每一个input标签都需要有一个name属性,才能进行提交 当点击登陆时,向数据库发生的数据是...

alokka的博客
2017/12/11
0
0
【转】表单提交及关闭当前页面并刷新数据

在DWZ文档中,对于DWZ框架Ajax无刷新表单提交处理流程描述如下: 1. ajax表单提交给服务器 2. 服务器返回一个固定格式json结构 3. js会调函数根据这个json数据做相应的处理 注意: DWZ框架默...

感觉太煽情
2014/11/19
0
0
angular04

ng四大特征: ①采用了MVC的设计模式 ②双向数据绑定(view和model) ③依赖注入 ④模块化设计 一、如何自定义模块并进行调用?? 自定义模块:angular.module() 模块之间如何相互之间的调用...

小祝融
2017/06/19
0
0

没有更多内容

加载失败,请刷新页面

加载更多

MySQL 主从同步

MySQL主从介绍 MySQL主从又叫做Replication、AB复制。简单讲就是A和B两台机器做主从后,在A上写数据,另外一台B也会跟着写数据,两者数据实时同步的 MySQL主从是基于binlog的,主上须开启bin...

野雪球
13分钟前
0
0
OSChina 周一乱弹 —— 温柔的人应该这样

Osc乱弹歌单(2018)请戳(这里) 【今日歌曲】 @clouddyy :#每日一歌# 《フィクション-sumika》 《フィクション-sumika》 手机党少年们想听歌,请使劲儿戳(这里) 假期时间干嘛去, @for...

小小编辑
今天
76
6
[LintCode] Serialize and Deserialize Binary Tree(二叉树的序列化和反序列化)

描述 设计一个算法,并编写代码来序列化和反序列化二叉树。将树写入一个文件被称为“序列化”,读取文件后重建同样的二叉树被称为“反序列化”。 如何反序列化或序列化二叉树是没有限制的,你...

honeymose
今天
6
0
java框架学习日志-7(静态代理和JDK代理)

静态代理 我们平时去餐厅吃饭,不是直接告诉厨师做什么菜的,而是先告诉服务员点什么菜,然后由服务员传到给厨师,相当于服务员是厨师的代理,我们通过代理让厨师炒菜,这就是代理模式。代理...

白话
今天
29
0
Flink Window

1.Flink窗口 Window Assigner分配器。 窗口可以是时间驱动的(Time Window,例如:每30秒钟),也可以是数据驱动的(Count Window,例如:每一百个元素)。 一种经典的窗口分类可以分成: 翻...

满小茂
今天
20
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部