JavaScript--取消a标签和form的submit提交默认行为
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
/**
* 取消浏览器默认行为
* 如：
* a链接跳转，
* submit按钮提交表单
* （PS:右键弹出菜单也是）
* 实现方式：
* event.preventDefault();
* return false;
*
* */
window.onload = function () {
var link = document.getElementById('link');
var check = document.getElementById("check");
// 表单元素获取
var inputTexts = document.querySelectorAll("[type='text']");
link.onclick = function () {
//取消浏览器默认行为
//event.preventDefault();
return false;
} // 阻止右键弹出菜单
document.oncontextmenu = function () {
return false;
} check.onclick = function () {
event.preventDefault();
if(inputTexts[0].value.indexOf('username') != -1) {
console.log("登录成功！请跳转页面~");
}else{
console.log("登录失败！请重新充值~");
}
} }
</script>
</head>
<body>
<form action="http://www.baidu.com">
<!-- 表单提交的时候，往往要先把数据进行验证，所以要先把默认的提交行为取消，数据通过检测合法后，配合JS实现数据的提交 -->
<input type="text" value="我是username!!" name="username">
<input type="submit" value="提交" id="check"/>
</form>
<a href="http://www.baidu.com">a链接标签有默认行为</a>
<a href="#">a链接标签有默认行为</a>
<a href="javascrit:;">a链接标签有默认行为</a>
<a href="http://www.baidu.com" id="link">a链接标签有默认行为</a>
</body>
</html>
JavaScript--取消a标签和form的submit提交默认行为的更多相关文章
- 【jquery采坑】Ajax配合form的submit提交（微擎表单提交，ajax验证，submit提交）
1.采坑:实现form的submit提交,在提交之前,进行ajax的不同校验,然后onsubmit=return check(),进行提交 1/1 目的:可以实现以 from的submit提交,然后还 ...
- ASP.Net MVC跳转，分为form的submit提交跳转和ajax跳转
1,用jquery ajax跳转的话,需要在前台用window.location("跳转网址")来跳转,在success后使用 2,用原声的form的submit来跳转,如下图 3 ...
- a标签替代input的submit提交功能
在工作中有时候会遇到A标签,但是提交表单的时候我们需要用到submit来提交表单,下面几行代码很好的解决了这个问题! <div class="btn"><a hr ...
- extjs在form表单提交成功、故障响应信息
类别Ext.form.Action.Submit 处理表单Form数据并返回response类对象. 这个类的仅在形式实例Form{@link Ext.form.BasicForm#submit 提交 ...
- Form 表单提交的几种方式
简单的总结一下form表单提交的几种方式:1.最简单的方式 就用form的submit提交方式,这种提交方式是不需要回调函数的 这种方式最近到一个form提供action路径后台接受就可以< ...
- form表单嵌套，用标签的form属性来解决表单嵌套的问题
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- js模拟form表单提交数据, js模拟a标签点击跳转，避开使用window.open引起来的浏览器阻止问题
js模拟form表单提交数据, js模拟a标签点击跳转,避开使用window.open引起来的浏览器阻止问题 js模拟form表单提交数据源码: /** * js模拟form表单提交 * @param ...
- JavaScript动态修改html组件form的action属性
用javaScript动态修改html组件form的action属性,可以在提交时再决定处理表单的页面. <%--JavaScript部分--%><script language=& ...
- html 常用标签 a form input 标签 等等等
前端HTML HTML介绍 Web服务本质 import socket sk = socket.socket() sk.bind(("127.0.0.1", 8080)) sk ...
随机推荐
- 2.Spring【DI】XML方式
依赖: 在A类中引用了B类,说明A依赖于B. 注入: 使用Spring框架给A类中的B对象的属性赋值. 直接上代码: 1.只使用IOC public class Person { private St ...
- webpack 处理图片文件
1. 安装 file-loader html-loader npm install file-loader html-loader --save-dev 其中html-loader生效需配合 html ...
- 如何实现shell并发 一个入门级可控多线程shell脚本方案
如何实现shell并发 很多人都问我如何写shell脚本,如何实现同时给三台ftp服务器上传文件,如何同时检测三台服务器是否alive等,其实这就是想实现shell的并发.那么shell并 ...
- DB-SQLServer：SQLServer
ylbtech--DB-SQLServer:SQLServer SQL是英文Structured Query Language的缩写,意思为结构化查询语言.SQL语言的主要功能就是同各种数据库建立联系 ...
- gin框架中间件
1. Gin框架中间件Gin框架中间件A. Gin框架允许在请求处理过程中,加入用户自己的钩子函数.这个钩子函数就叫中间件B. 因此,可以使用中间件处理一些公共业务逻辑,比如耗时统计,日志打印,登陆校 ...
- PAT甲级——A1028 List Sorting
Excel can sort records according to any column. Now you are supposed to imitate this function. Input ...
- Composer安装Yii2以及相关扩展
1.安装redis扩展 命令:composer require yiisoft/yii2-redis Git地址:https://github.com/yiisoft/yii2-redis/blob/ ...
- [转]SQLserver字符串分割函数
一.按指定符号分割字符串,返回分割后的元素个数,方法很简单,就是看字符串中存在多少个分隔符号,然后再加一,就是要求的结果. CREATE function Get_StrArrayLength ( ) ...
- springboot使用@Aspect实现AOP记录日志讲解
AOPAOP为Aspect Oriented Programming的缩写,意为:面向切面编程,通过预编译方式和运行期动态代理实现程序功能的统一维护的一种技术.在日常开发当中经常用来记录日志,方法跟踪 ...
- Codeforces 899F Letters Removing 线段树/树状数组
虽然每次给一个区间,但是可以看作在区间内进行数个点操作,同样数列下标是动态变化的,如果我们将每个字符出现看作1,被删除看作0,则通过统计前缀和就能轻松计算出两个端点的位置了!这正是经典的树状数组操作 ...