原生JS元素怎么取消事件
关于原生JS元素怎么取消事件，有3种方式
常规方法：removeEventListener
案例：
<body>
<div id="myDIV"> div 元素添加了 onmousemove 事件句柄，在你移动鼠标时会显示随机数。
<p>点击按钮移除 DIV 的事件句柄。</p>
<button onclick="removeHandler()" id="myBtn">点我</button>
</div>
<p id="demo"></p>
<script>
document.getElementById("myDIV").addEventListener("mousemove", myFunction);
function myFunction()
{
document.getElementById("demo").innerHTML = Math.random();
}
function removeHandler()
{
document.getElementById("myDIV").removeEventListener("mousemove", myFunction);
}
</script>
</body>
其他方法：通过function里面的判断状态，然后return false
案例：
var state=1;
document.getElementById("myBtn").addEventListener("click", function(){
if(state==0){
return false
}else{
alert(“caca”);
state=0;
}
});
其他方法：通过function里面再次添加此事件，覆盖事件后，然后再return false
案例：
var state=1;
document.getElementById("myBtn").addEventListener("click",
function(){
if(state==0){
document.getElementById("myBtn") .addEventListener("tap",
function() {return false;});
}else{
alert(“caca”);
state=0;
}
});
原生JS元素怎么取消事件的更多相关文章
- 原生js移动端touch事件实现上拉加载更多
大家都知道jQuery里没有touch事件,所以在移动端使用原生js实现上拉加载效果还是很不错的,闲话不多说,代码如下: //获取要操作的元素 var objSection = document.ge ...
- 原生js绑定和解绑事件,兼容IE,FF,chrome
主要是最近项目中用到了原生的js 解绑和绑定 事件 然后今天研究了一下,其实问题不大,不过要注意不要把单词写错了,今天我就找了好久单词写错了. 需求:当鼠标移上去以后,给Select加载元素,接着解 ...
- 原生js移动端滑动事件
移动端触屏滑动的效果其实就是图片轮播,在PC的页面上很好实现,绑定click和mouseover等事件来完成.但是在移动设备上,要实现这种轮播的效果,就需要用到核心的touch事件.处理touch事件 ...
- JS错误记录 - 取消事件冒泡、按钮、回车、ctrl回车提交留言
window.onload = function () { var oDiv = document.getElementById('div1'); var oBtn = document.getEle ...
- 基于css3新属性transform及原生js实现鼠标拖动3d立方体旋转
基于css3新属性transform,实现3d立方体的旋转 通过原生JS,点击事件,鼠标按下.鼠标抬起和鼠标移动事件,实现3d立方体的拖动旋转,并将旋转角度实时的反应至界面上显示 实现原理:通过获取鼠 ...
- 通过原生JS实现为元素添加事件
自己写了一个为元素添加事件的方法,并封装到对象中. 说明: id : 目标元素的ID type: 事件的类型,注意的是不能加on fn:事件处理程序 isBubble :规定事件流 代码: var b ...
- 原生JS事件绑定方法以及jQuery绑定事件方法bind、live、on、delegate的区别
一.原生JS事件绑定方法: 1.通过HTML属性进行事件处理函数的绑定如: <a href="#" onclick="f()"> 2.通过JavaS ...
- JavaScript之事件委托（附原生js和jQuery代码）
事件委托的原理依赖于事件冒泡,可以通过给父元素的事件委托来确定是哪个子元素触发了事件从而做一系列操作. 使用事件委托的优点 1.操作子元素时不用一一遍历,可以根据事件触发的对象而进行相应操作 dom结 ...
- onload事件与ready事件的区别，原生js与jquery的区别
onload事件与ready事件分别是原生js与jquery的入口函数 原生js入口函数写法: window.onload=function(){ } jquery入口函数写法: $(document ...
随机推荐
- 【开源】做了一个WinForm窗体的投影组件，能够为窗口添加影子效果
最近手头上的项目终于忙得差不多了,想起好久没有更新了的NanUI,再看着每天QQ群未读消息闪烁的标志,突然才发现似乎愧对了群里各位喜爱NanUI的朋友们.于是乎,就想趁这几天有时间,好好的修复一下Na ...
- java设计模式综合项目实战视频教程
java设计模式综合项目实战视频教程 视频课程目录如下: 第01节课:本课程整体内容介绍:X-gen系统概况,包括:引入.X-gen项目背景.X-gen的HelloWorld第02节课:X-gen整体 ...
- AospExtended K3 Note最新官方版 Android7.1.2 极速 省电 流畅 Galaxy XIAOMI Moto Lenovo Coolpad 均支持
AospExtended 最新官方版 Android7.1.2 极速 省电 流畅 Galaxy XIAOMI Moto Lenovo Coolpad 均支持 之前用过1629开发版等,体验了很 ...
- 如何解释json的字符串
public void getToken(){ String json = getJedis().get("f2b9152f36424e8b8a454df9b50eb743"); ...
- 第一章：pip 安装 tar.gz 结尾的文件 和 .whl 结尾的文件
1. 假如后缀中还有 .tar.gz 的文件通过 pip 命令进行安装步骤. .单击 .tar.gz结尾的文件,并且对文件进行解压,进入到解压目录中,通过python命令进行安装. 命令如下:在dos ...
- gulp 运用 的理解
ugulp.task('build', function() { runSequence('clean', 'copy', ['uglify', 'sass', 'htmlmin'], 'base64 ...
- java在的数据类型
java数据类型的划分 程序的本质=数据的处理: 数据库的本质=数据的存储. java之中数据类型一共分为两大类. ·基本数据类型: 数值型: 整型:byte,short,int,long 默认值都是 ...
- 如何将md文件转换成带目录的html文件
配置环境node 去官网下一个node安装包,下一步下一步: 由于现在的node都自带npm,直接 npm install i5ting_toc 这样安装好了i5ting_toc这个包, 进入你实现准 ...
- thinkphp的空控制器和空操作以及对应解决方法
在上篇随笔中我们已经知道了tp框架的四种访问方式,那么当在地址栏输入不存在的操作方法.控制器会怎么样呢? 先看一下定义: 空操作:一个对象(控制器)调用本身不存在的方法 空控制器:在实例化控制器对象的 ...
- Asp.Net MVC-01-起步
创建第一个MVC程序 我们先创建一个ASP.NET Web程序 模板选择MVC,因为不想使用默认的身份认证我们点击更改身份认证并选择不进行身份认证. 创建的项目结构如下: 配置与初始化 Web配置文件 ...