js解除事件绑定的问题，参数怎么填解除事件绑定需要函数名但是如果给出函数名 this又发生了变化
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了js解除事件绑定的问题，参数怎么填解除事件绑定需要函数名但是如果给出函数名 this又发生了变化相关的知识，希望对你有一定的参考价值。
<!DOCTYPE>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<meta name="format-detection" content="telephone=no"/>
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="white">
<style type="text/css">
* padding:0; margin:0;
#div1 width:100px; height:100px; background-color:Red; position:absolute;
</style>
<script language="javascript" type="text/javascript">
function PhoneDrag(id)
var _this = this;
this.oDiv = document.getElementById(id);
this.disX = 0;
this.disY = 0;
this.oDiv.addEventListener("touchstart", function (ev)
_this.fnDown(ev);
, false);
PhoneDrag.prototype.fnDown = function (ev)
var _this = this;
var oEvent = ev.touches[0];
ev.preventDefault();
this.disX = oEvent.clientX - this.oDiv.offsetLeft;
this.disY = oEvent.clientY - this.oDiv.offsetTop;
document.addEventListener("touchmove", function (ev)
_this.fnMove(ev);
, false);
document.addEventListener("touchend", function (ev)
//这里是手指抬起的时候 如何删除touchmove事件
document.removeEventListerner(document, "这里怎么填");
, false);
PhoneDrag.prototype.fnMove = function (ev)
var oEvent = ev.touches[0];
var iX = oEvent.clientX - this.disX;
var iY = oEvent.clientY - this.disY;
this.oDiv.style.top = iY + "px";
this.oDiv.style.left = iX + "px";
window.onload = function ()
new PhoneDrag("div1");
</script>
</head>
<body>
<div id="div1"></div>
</body>
</html>
这是移动端移动DIV的例子
var _this = this;
this.oDiv = document.getElementById(id);
this.disX = 0;
this.disY = 0;
this.oDiv.addEventListener("touchstart", function (ev)
_this.fnDown(ev);
, false);
PhoneDrag.prototype.fnDown = function (ev)
var _this = this;
var oEvent = ev.touches[0];
ev.preventDefault();
this.disX = oEvent.clientX - this.oDiv.offsetLeft;
this.disY = oEvent.clientY - this.oDiv.offsetTop;
// 解除事件绑定的时候需要用到
var touchmoveHandle = function (ev)
_this.fnMove(ev);
;
document.addEventListener("touchmove", touchmoveHandle, false);
document.addEventListener("touchend", function (ev)
//这里是手指抬起的时候 如何删除touchmove事件
document.removeEventListerner('touchmove', touchmoveHandle, false);
, false);
PhoneDrag.prototype.fnMove = function (ev)
var oEvent = ev.touches[0];
var iX = oEvent.clientX - this.disX;
var iY = oEvent.clientY - this.disY;
this.oDiv.style.top = iY + "px";
this.oDiv.style.left = iX + "px";
window.onload = function ()
new PhoneDrag("div1");
追问
这个还是解除不了事件绑定
追答document.addEventListener("touchend", function (ev)// 开始
alert('touchend')
//这里是手指抬起的时候 如何删除touchmove事件
document.removeEventListerner('touchmove', touchmoveHandle, false);
// 结束
alert('touchend2');
, false);
加两个弹窗试试，看看能不能弹出来。
如果能弹出来说明，执行了解除绑定的代码。
追问弹了很多次 解除不了事件
追答能看看你的代码吗？
参考技术A // 因为你注册事件时的第二个参数函数是匿名函数调用已存函数// 我不知道这样写是否有效 你试下
document.removeEventListerner("touchmove", function (ev)
_this.fnMove(ev);
, false);
只有被addEventListener方法添加的事件才可以使用removeEventListener来注销．
删除事件时removeEventListener的三个参数必须要跟addEventListener的参数相同
语法：elem.removeEventListener(event_type,fun_name,bool);
event_type:事件类型．比如单击，或双击．或移动鼠标事件等．
fun_name:要被注销的事件名称，函数名．
bool:布尔值．true或false.true代表支持事件冒泡．false则不支持事件冒泡捕获
那代码怎么改呢？
追答PhoneDrag.prototype.fnDown = function (ev)var _this = this;
var oEvent = ev.touches[0];
ev.preventDefault();
this.disX = oEvent.clientX - this.oDiv.offsetLeft;
this.disY = oEvent.clientY - this.oDiv.offsetTop;
// 变量保存函数句柄
var touchmoveFuc = function (ev)
_this.fnMove(ev);
;
// 引用touchmoveFuc
document.addEventListener("touchmove", touchmoveFuc , false);
document.addEventListener("touchend", function (ev)
// 消除touchmoveFuc
document.removeEventListener('touchmove', touchmoveFuc , false);
, false);
事件绑定与解除js
//Ys为元素,Sj为事件,Hs为函数,bol选择是true绑定事件,还是false解除事件
//需要提前定义a,b,c,bol
function thing(Ys,Sj,Hs,bol){
var info=navigator.userAgent;
if (info.indexOf(‘NSIE‘)!=-1) {
var Sj=‘on‘+Sj;
if (bol==true) {
Ys.attachEvent(Sj,Hs);
} else{
Ys.detachEvent(Sj,Hs);
}
} else{
if (bol==true) {
Ys.addEventListener(Sj,Hs,false);
} else{
Ys.removeEventListener(Sj,Hs,false);
}
}
}
以上是关于js解除事件绑定的问题，参数怎么填解除事件绑定需要函数名但是如果给出函数名 this又发生了变化的主要内容，如果未能解决你的问题，请参考以下文章