[0009 · js] mobile terminal is one element at the same time add a click event with a long press event

Operation of the mobile terminal has a simple aim, then it needs to be related to an element simultaneously increase the click and long press event, as follows:

	//首先需要禁止页面上的默认长按事件
	document.body.onselectstart=document.body.oncontextmenu=function(){return false;};
	//长按初值
	var longClick = 0;
	//短按初值
	var shortClick = 0;
	//时间初值
	var timeout = 0;
	$('.demo').each(function(){ 
		var $this = $(this);
		//监听按下屏幕事件
		$this.on('touchstart', function(){ 
			longClick = 0;
			shortClick = 1;
			timeout = setTimeout(function() { 
				longClick = 1;
				shortClick = 0;
				//==触发成功时如何表现,这里可以写一些代码==//
			}, 300);  
		}); 
		//长按移动事件排除
		$this.on('touchmove', function(){ 
			clearTimeout(timeout);
			//==针对触发成功时如何恢复,这里可以写一些代码==//
			timeout = 0;
			e.preventDefault();	
		}); 	
		//监听离开屏幕事件		  
		$this.on('touchend', function(){ 
			clearTimeout(timeout);
			if(timeout != 0 && shortClick == 1 && longClick != 1)
			{
				//==业务代码==//					
			}else if(timeout != 0 && longClick == 1 && shortClick != 1 ){
				document.body.onselectstart=document.body.oncontextmenu=function(){};
				//==业务代码==//						
			}
			return false;
		});  
	});				

Guess you like

Origin blog.csdn.net/HoD_DoH/article/details/93380091