When using mobile devices for touch operations, the most commonly used ones are tapping, pressing and holding the screen, or gesture operations. jQuery Mobile can respond to the user's specific touch behavior through bound touch events.

1. Tap and hold

to enter the code directly (everything is in the code, take a closer look!)

	

		

			
Tap事件处理
		
		

			轻击页面进入下一页

			按住不放，打开关于对话框
		
		
	
	
	

		

			
Tap事件处理
		
		

			轻击页面返回前一页
		
		
	
	

		

			
关于本程序
		

		

			演示轻击触控事件响应
		
	

tap: tap event

taphold: hold event

2. Swipe

Swipe refers to writing with your finger or hand When the pen slides quickly left or right on the screen, the swipeleft event or swiperight event will be triggered.

	

		

			
swipe事件处理
		
		

			向右滑动页面进入下一页

			向左滑动页面，打开关于对话框
		
		
	
	
	

		

			
swipe事件处理
		
		

			向右滑动页面进入前一页br/>
			向左滑动页面，打开关于对话框
		
		
	
	

		

			
关于本程序
		

		

			演示swipeleft&swiperight触控事件响应
		
	

	

A trick is used in the above code. If you need to change the switching effect during the interface switching process, you must use a hyperlink to implement it. Set the display attribute of the link If it is none, call the click() method in the listening function to perform interface switching, and then add data-transition to the link to set the switching effect.

3. Virtual mouse event

##EventMeaningvmouseoverTouch or slide over the DOM containervmoseoutTouch Or slide away vmousedown touch or press vmoseupTouch off or mouse button ReleasevclickThe touch ends or the mouse button is releasedThe vclick event is usually in vmouseup Triggered 300ms after the eventvmousecancelTriggered when the mousecancel event is initiated in the touch event...... ..................

	

		

			
vMouse事件处理
		
		

			轻击页面，显示点击位置
		
		

		内容底部
		
	

The above is the content of Xiaoqiang's HTML5 mobile development road (52) - touch interaction in jquerymobile. For more related content, please pay attention to the PHP Chinese website (m.sbmmt.com)!