<!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的例子
2 回答
POPMUISE
TA贡献1765条经验 获得超5个赞
|
只有被addEventListener方法添加的事件才可以使用removeEventListener来注销．
删除事件时removeEventListener的三个参数必须要跟addEventListener的参数相同
语法：elem.removeEventListener(event_type,fun_name,bool);
event_type:事件类型．比如单击，或双击．或移动鼠标事件等．
fun_name:要被注销的事件名称，函数名．
bool:布尔值．true或false.true代表支持事件冒泡．false则不支持事件冒泡捕获
慕码人8056858
TA贡献1803条经验 获得超6个赞
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; // 解除事件绑定的时候需要用到 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");} |
- 2 回答
- 0 关注
- 108 浏览
添加回答
举报
0/150
提交
取消