jstouch双击

Ⅰ js 判断双手指滑动 应该说是：在vue中如何实现 对div 双手指的放大和缩小功能。

1. 绑定触摸事件 touchstart touchmove

2. 监听触摸事件event.touches中触摸点的数量

3. 在touchmove事件做判定，如果 event.touches.length==2 则记录此次两点之间的距离：Math.sqrt(Math.pow((x2-x1),2)+Math.pow((y2-y1),2))

4. 在手指移动过程中针对每一次的两点距离进行比较。如果相对上次较大则放大，否则缩小。div的缩放通过transform:scale(x)进行控制

Ⅱ 移动端js touch 和 click 事件问题

touchend的时候，再重新 dispatchEvent 一个click事件出来，http://www.w3school.com.cn/xmldom/met_element_dispatchevent.asp

Ⅲ js touch事件和a链接相兼容问题

你解决这个问题了吗？我现在碰到类似的问题了。

Ⅳ 手机端如何用JS实现触屏

//html5新增touch事件
//禁用手机默认的触屏滚动行为
document.addEventListener('touchmove',function(event){
	event.preventDefault();
},false);
//touchstart事件
functiontouchSatrtFunc(evt){
	try{
		//evt.preventDefault();//阻止触摸时浏览器的缩放、滚动条滚动等

		vartouch=evt.touches[0];//获取第一个触点
		varx=Number(touch.pageX);//页面触点X坐标
		vary=Number(touch.pageY);//页面触点Y坐标
		//记录触点初始位置
		startX=x;
		startY=y;


	}catch(e){
		alert('touchSatrtFunc：'+e.message);
	}
}

//touchmove事件，这个事件无法获取坐标
functiontouchMoveFunc(evt){
	try{
		//evt.preventDefault();//阻止触摸时浏览器的缩放、滚动条滚动等
		vartouch=evt.touches[0];//获取第一个触点
		varx=Number(touch.pageX);//页面触点X坐标
		vary=Number(touch.pageY);//页面触点Y坐标


//document.getElementById("version").innerHTML="原:"+startY+""+"现:"+y;
		//判断滑动方向
		
		if(y-startY>100){
			swipeDown();
		}elseif(y-startY<-100){
			swipeUp();
		}
	}catch(e){
		alert('touchMoveFunc：'+e.message);
	}
}

//touchend事件
functiontouchEndFunc(evt){
	try{
		//evt.preventDefault();//阻止触摸时浏览器的缩放、滚动条滚动等


	}catch(e){
		alert('touchEndFunc：'+e.message);
	}
}

//绑定事件
functionbindEvent(){
	document.addEventListener('touchstart',touchSatrtFunc,false);
	document.addEventListener('touchmove',touchMoveFunc,false);
	document.addEventListener('touchend',touchEndFunc,false);
}

//判断是否支持触摸事件
functionisTouchDevice(){
	//document.getElementById("version").innerHTML=navigator.appVersion;

	try{
		document.createEvent("TouchEvent");
		//alert("支持TouchEvent事件！");

		bindEvent();//绑定事件
	}catch(e){
		alert("不支持TouchEvent事件！"+e.message);
	}
}

Ⅳ 如何js实现触屏点击事件

移动端触屏滑动的效果其实就是图片轮播，在PC的页面上很好实现，绑定click和mouseover等事件来完成。但是在移动设备上，要实现这种轮播的效果，就需要用到核心的touch事件。处理touch事件能跟踪到屏幕滑动的每根手指。

以下是四种touch事件

touchstart://手指放到屏幕上时触发
touchmove://手指在屏幕上滑动式触发
touchend://手指离开屏幕时触发
touchcancel://系统取消touch事件的时候触发，这个好像比较少用

每个触摸事件被触发后，会生成一个event对象，event对象里额外包括以下三个触摸列表

ouches://当前屏幕上所有手指的列表targetTouches://当前dom元素上手指的列表，尽量使用这个代替touches
changedTouches://涉及当前事件的手指的列表，尽量使用这个代替touches
这些列表里的每次触摸由touch对象组成，touch对象里包含着触摸信息，主要属性如下：
clientX/clientY://触摸点相对浏览器窗口的位置
pageX/pageY://触摸点相对于页面的位置
screenX/screenY://触摸点相对于屏幕的位置
identifier://touch对象的ID
target://当前的DOM元素

注意：

手指在滑动整个屏幕时，会影响浏览器的行为，比如滚动和缩放。所以在调用touch事件时，要注意禁止缩放和滚动。

1.禁止缩放

通过meta元标签来设置。

<metaname="viewport"content="target-densitydpi=320,width=640,user-scalable=no">

2.禁止滚动

preventDefault是阻止默认行为，touch事件的默认行为就是滚动。

event.preventDefault();

案例：

下面给出一个案例，需在移动设备上才能看出效果。

1.定义touchstart的事件处理函数，并绑定事件：

if(!!self.touch)self.slider.addEventListener('touchstart',self.events,false);

//定义touchstart的事件处理函数

start:function(event){
vartouch=event.targetTouches[0];//touches数组对象获得屏幕上所有的touch，取第一个touch
startPos={x:touch.pageX,y:touch.pageY,time:+newDate};//取第一个touch的坐标值
isScrolling=0;//这个参数判断是垂直滚动还是水平滚动
this.slider.addEventListener('touchmove',this,false);
this.slider.addEventListener('touchend',this,false);
},

触发touchstart事件后，会产生一个event对象，event对象里包括触摸列表，获得屏幕上的第一个touch,并记下其pageX,pageY的坐标。定义一个变量标记滚动的方向。此时绑定touchmove,touchend事件。

2.定义手指在屏幕上移动的事件，定义touchmove函数。

//移动

move:function(event){
//当屏幕有多个touch或者页面被缩放过，就不执行move操作
if(event.targetTouches.length>1||event.scale&&event.scale!==1)return;
vartouch=event.targetTouches[0];
endPos={x:touch.pageX-startPos.x,y:touch.pageY-startPos.y};
isScrolling=Math.abs(endPos.x)<Math.abs(endPos.y)?1:0;//isScrolling为1时，表示纵向滑动，0为横向滑动
if(isScrolling===0){
event.preventDefault();//阻止触摸事件的默认行为，即阻止滚屏
this.slider.className='cnt';
this.slider.style.left=-this.index*600+endPos.x+'px';
}
},

同样首先阻止页面的滚屏行为，touchmove触发后，会生成一个event对象，在event对象中获取touches触屏列表，取得第一个touch,并记下pageX,pageY的坐标，算出差值，得出手指滑动的偏移量，使当前DOM元素滑动。

3.定义手指从屏幕上拿起的事件，定义touchend函数。

//滑动释放

end:function(event){
varration=+newDate-startPos.time;//滑动的持续时间
if(isScrolling===0){//当为水平滚动时
this.icon[this.index].className='';
if(Number(ration)>10){
//判断是左移还是右移，当偏移量大于10时执行
if(endPos.x>10){
if(this.index!==0)this.index-=1;
}elseif(endPos.x<-10){
if(this.index!==this.icon.length-1)this.index+=1;
}
}
this.icon[this.index].className='curr';
this.slider.className='cntf-anim';
this.slider.style.left=-this.index*600+'px';
}
//解绑事件
this.slider.removeEventListener('touchmove',this,false);
this.slider.removeEventListener('touchend',this,false);
},

手指离开屏幕后，所执行的函数。这里先判断手指停留屏幕上的时间，如果时间太短，则不执行该函数。再判断手指是左滑动还是右滑动，分别执行不同的操作。最后很重要的一点是移除touchmove,touchend绑定事件。

Ⅵ 区分touch 事件是单击还是双击的方法

方法如下：
-(void)singleTap{
NSLog(@"Tap 1 time");
}
-(void)doubleTap{
NSLog(@"Tap 2 time");

}

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
UITouch *touch = [touches anyObject];

NSTimeInterval delaytime = 0.4;//自己根据需要调整

switch (touch.tapCount) {
case 1:
[self performSelector:@selector(singleTap) withObject:nil afterDelay:delaytime];
break;
case 2:{
[NSObject :self selector:@selector(singleTap) object:nil];
[self performSelector:@selector(doubleTap) withObject:nil afterDelay:delaytime];

}
break;
default:
break;
}
}

Ⅶ js或者jquery怎么实现iphone的AssistiveTouch效果

一、苹果手机设置“屏幕小圆点”方法：
1、设置-通用-辅助功能-AssistiveTouch-打开“AssistiveTouch”。
2、更改图标：设置-通用-辅助功能-AssistiveTouch-打开“AssistiveTouch”-自定顶层菜单-加号-选择图标-完成。
二、苹果手机“屏幕小圆点”图标功能：
1、单击“主屏幕”图标：代替单击Home键。
2、双击“主屏幕”图标：代替双击Home键，可打开多任务处理界面，向上滑动可关闭后台应用。
3、单击“多任务”图标：代替双击Home键，可打开多任务处理界面，向上滑动可关闭后台应用。
4、单击“锁定屏幕”图标：代替按关机键，可锁定屏幕。
5、长按“锁定屏幕”图标：代替长按关机键，可以弹出“滑动来关机”界面。
6、单击“静音”图标：代替按静音键，可设置静音。
7、单击“屏幕快照”图标：代替“同时按电源键和Home键”进行截屏。
8、按“调高音量”和“调低音量”图标：代替音量键。

Ⅷ 网页使用touch.js左右滑动，手机会触发默认手势翻页怎么办

如果你是开发者，建议你把网页的手势滑动区域改一下，或者把需要的滑动距离改小一点。
如果你是用户，就把手势翻页关了吧。

Ⅸ js写touch拖拽事件手指放在要拖动的物体上会迅速闪动怎么回事

pc上的web页面鼠标会产生onmousedown、onmouseup、onmouseout、onmouseover、onmousemove的事件，但是在移动终端如iphone、ipod Touch、ipad上的web页面触屏时会产生回ontouchstart、ontouchmove、ontouchend、ontouchcancel事件，分答别对应了触屏开始、拖拽及完成触屏事件和取消。

Ⅹ js怎么使用touchmove事件

随着触屏手机、平板电脑的普及和占有更多用户和使用时间，触屏的触碰、滑动等事件也成为javaScript开发不可避免的知识，现在何问起就和大家一起学习js的触屏操作，js的触屏touchmove事件，为手指在屏幕上滑动触发的事件，这里制作了一个简单的示例，可以通过这个示例认识touchmove事件。