ajax方式表单拦截
html
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
</head>
<body>
<form method="post" action="http://www.baidu.com" onsubmit="return check()" >
姓名:<input type="text" name="uName" id="uName" onblur="checkName();"><span class="message"></span><br/>
密码:<input type="password" name="uPwd" id="uPwd" onblur="checkPwd()"><span class="message" ></span><br/>
<input type="submit" value="登录">
</form>
<script type="text/javascript" src="login.js"></script>
</body>
</html>
JS
function checkName(){
var uName=document.getElementById("uName")
var name=uName.value;
var message=uName.nextSibling;
if(name.length==0){
message.innerHTML="用户名不能为空"
// this.focus();
return false;
}else if (name.length<4||name.length>10){
message.innerHTML="用户名长度为4-10位之间"
return false;
}else{
message.innerHTML="用户名输入正确"
return true;
}
}
function checkPwd(){
var uPwd=document.getElementById("uPwd");
var pwd=uPwd.value;
var message=uPwd.nextSibling;
if(pwd.length==0){
message.innerText="用户密码不能为空"
return false;
}else{
message.innerText="用户密码输入正确"
return true;
}
}
function check(){
if(checkName()&&checkPwd()){
//发送ajax //操作成功后 返回true 否则返回false
}
}
可以通过check这个函数的返回结果控制表单的跳转，为true 才跳转
ajax方式表单拦截的更多相关文章
- Jquery ajax提交表单几种方法
在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$('#表单ID').serialize();就行了,下面我来介绍两个提交表单数据的方法. ...
- lavarel框架中如何使用ajax提交表单
开门见山,因为laravel以post形式提交数据时候需要加{{csrf_field()}}防止跨站攻击,所以当你用ajax提交表单时候自然也要加 在网上看了很多的解决方式,我是用下面这种方法解决的: ...
- ajax验证表单元素规范正确与否 ajax展示加载数据库数据 ajax三级联动
一.ajax验证表单元素规范正确与否 以用ajax来验证用户名是否被占用为例 1创建表单元素<input type="text" id="t"> 2 ...
- Jquery ajax提交表单几种方法详解
[导读] 在jquery中ajax提交表单有post与get方式,在使用get方式时我们可以直接使用ajax 序列化表单$( 表单ID) serialize();就行了,下面我来介绍两个提交表单数据的 ...
- ajax提交表单序列化（serialize()）数据
知识点: $("#form").serialize();将表单数据序列化为标准URL编码文本字符串(key1=value1&key2=value2…). 以下用一个例子来演 ...
- ajax提交表单、ajax实现文件上传
ajax提交表单.ajax实现文件上传,有需要的朋友可以参考下. 方式一:利用from表单的targer属性 + 隐藏的iframe 达到类似效果, 支持提交含有文件和普通数据的复杂表单 方式二:使用 ...
- 第一百六十节，封装库--JavaScript，ajax注册表单到数据库
封装库--JavaScript,ajax注册表单到数据库 效果图 前台js var biaodan = $().xu_lie_biao_dan($('form').sh_jd()); //序列化获取表 ...
- 关于ajax提交表单的一些实例及遇到的问题和解决办法
ajax提交的表单有两种情况: 第一种:input type类型没有file上传文件类型的表单 第二种:input type类型有file上传文件类型的表单 之所以分为两种:是因为原生ajax是不能提 ...
- JQuery ajax提交表单及表单验证
JQuery ajax提交表单及表单验证 博客分类: jsp/html/javascript/ajax/development Kit 开源项目 注:经过验证,formValidator只适合一个 ...
随机推荐
- Jquery中.attr与.prop的区别
☆ http://www.jb51.net/article/114876.htm http://www.365mini.com/page/jquery-attr-vs-prop.htm https:/ ...
- prisma 服务器端订阅试用
graphql 协议是支持数据的实时订阅功能的(一般基于websocket 进行实现) prisma 支持客户端订阅以及服务器端订阅(类似webhook),可以方便将 数据推送后端服务 目的 pr ...
- cocos2dx学习资料
[9秒原创]cocos2d-x——CCScrollView用法 http://www.9miao.com/thread-45619-1-1.html [9秒原创]cocos2d-x——场景切换效果示例 ...
- nginx 配置 vhosts 的方案
网上有很多种 nginx 配置 vhosts,来个比较方便的. 步骤如下: 在 conf 目录建一个vhosts 目录. 在 nginx.conf 末尾加入 include vhosts/*.conf ...
- 【转】每天一个linux命令（9）：touch 命令
原文网址:http://www.cnblogs.com/peida/archive/2012/10/30/2745714.html linux的touch命令不常用,一般在使用make的时候可能会用到 ...
- linQ to sql 查询生成的sql语句
1. 如果是控制台应用,直接 db.Log = Console.Out; 2.其他应用则用如下语句: StringBuilder sql = new StringBuilder(); db.Log ...
- JZ2440 裸机驱动 第6章 存储控制器
本章目标: 了解S3C2410/S3C2440地址空间的布局 掌握如何通过总线形式访问扩展的外设,比如内存.NOR Flash.网卡等 ························ ...
- 在word中输入任意角度旋转图片
Sub 图片旋转任意角度() Dim sha As Shape, isa As InlineShape Static s As Integer Application.ScreenUpdating = ...
- Makefile | Linux嵌入式编程 使用详细图解
针对的是对Makefile一点都不会的小白哦! 练习之前我们要做好准备: (1):第一步创建一个目录,因为实验过程中生成的文件会很多,不要把你系统里的文件搞得乱七八糟. [cjj@bogon ~]$ ...
- CMake Error: Curses library not found. Please install appropriate package
编译安装MySQL的时候,出现错误: -- Could NOT find Curses (missing: CURSES_LIBRARY CURSES_INCLUDE_PATH) CMake Err ...