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只适合一个 ...
随机推荐
- C语言命令行解析函数：getopt/getopt_long
命令行工具下的参数选项有两种,长选项和短选项.短选项以-开头,后面跟单个字母:长选项以--开头,后面可跟多个字母. 一. getopt() 1.功能:解析命令行短选项参数 2.函数原型: #inclu ...
- Spring插件3.8.2的安装
主机环境:win8 64bit eclipse版本:4.5.2 MARS 插件版本:Spring Tool Suite3.8.2 安装过程:直接在线安装,没有先在官网把插件下载再安装. 主要步骤: 1 ...
- [LeetCode系列] 双单链表共同节点搜索问题
找到两个单链表的共同节点. 举例来说, 下面两个链表A和B: A: a1 → a2 ↘ c1 → c2 → c3 ↗ B: b1 → b2 → b3 共同节点为c1. 分析: 共同节点距离A,B的起点 ...
- 【转】每天一个linux命令（54）：ping命令
原文网址:http://www.cnblogs.com/peida/archive/2013/03/06/2945407.html Linux系统的ping命令是常用的网络命令,它通常用来测试与目标主 ...
- TopCoder客户端安装
参考:https://blog.csdn.net/github_39353095/article/details/76165940 首先,下载 Java 环境. https://www.java.co ...
- bzoj 3277 串 && bzoj 3473 字符串 && bzoj 2780 [Spoj]8093 Sevenk Love Oimaster——广义后缀自动机
题目:https://www.lydsy.com/JudgeOnline/problem.php?id=3277 https://www.lydsy.com/JudgeOnline/problem.p ...
- Rect参数的简易理解方式
以屏幕左上角为原点开始计算 向下 和 向右均为整数 new Rect(left, top, right, bottom) Rect参数的意思代表的是矩形的左上角的坐标(left.top)和右下角的坐标 ...
- html + php 框架
<html> <head><meta http-equiv="Content-Type" content="text/html; chars ...
- MySQL concat用法举例
concat配合information_schema的应用 1 concat的一般用法主要是用于拼接 示例: 执行语句 SELECT CONCAT('M','y','S','Q','L') 可以 ...
- [UE4]事件处理(Handling Events)和委托（Delegate）代码示例（二）【C++】
3. 创建带参数的委托 我们可以通过修改委托的签名来使其接受参数 比如我们需要接受一个参数的话,可以在 GameMode 中这样声明: DECLARE_DELEGATE_OneParam(FParam ...