在 SegmentFault，学习技能、解决问题
每个月，我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。
点击阅读原文
完美解决ios10及以上Safari无法禁止缩放的问题
4 天前 发布，来源：
移动端web缩放有两种：
1.双击缩放；
2.双指手势缩放。
在iOS 10以前，iOS和Android都可以通过一行meta标签来禁止页面缩放
&meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" /&
但iOS 10开始，meta设置在Safari内无效了。
后来在网上看到一个解决方案：
window.onload=function () {
document.addEventListener('touchstart',function (event) {
if(event.touches.length&1){
event.preventDefault();
var lastTouchEnd=0;
document.addEventListener('touchend',function (event) {
var now=(new Date()).getTime();
if(now-lastTouchEnd&=300){
event.preventDefault();
lastTouchEnd=
经过测试，这种方法只能禁止双击缩放。
只好继续找解决方案了。
原来在iOS里有一组双指手势操作的事件：gesturestart、gesturechange、gestureend
在上面的js方法里加入下面的事件监听：
document.addEventListener('gesturestart', function (event) {
event.preventDefault();
既不能双击缩放，也不能双指缩放。
这样就OK了，安排！
加入掘金和开发者一起成长。发送简历到 hr@xitu.io，期待你的加入！
我要该，理由是：
关闭理由：
删除理由：
忽略理由：
推广（招聘、广告、SEO 等）方面的内容
与已有问题重复（请编辑该提问指向已有相同问题）
答非所问，不符合答题要求
宜作评论而非答案
带有人身攻击、辱骂、仇恨等违反条款的内容
无法获得确切结果的问题
非开发直接相关的问题
非技术提问的讨论型问题
其他原因（请补充说明）共被编辑 18 次
再次更新，就LZ后来补充的需求而言，需要的是下面的方案。
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件（比如span标签），那么，可以用touchend click做代替。
要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存在touch过程中是否发生了touchmove。
由于touchend事件会触发两次：touchend一次以后，再次按屏幕上任意一个地方都会触发touchend(对双击操作的处理)。因此得在事件处理里面加入setTimeout。(参见)
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1} span{background: #fFC;margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("touchend click",".appraisal",function(evt){
if ( !this.classList.contains("touchmoving") ){
var that =
setTimeout(function(){
// 防止第二次触发touchend
// 你的相应代码
alert(that.textContent) ;
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
$("#new").on("click",function(){
var a = document.createElement("span") ;
a.classList.add("appraisal") ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
可能性多了去了，为何一定会是是jQuery.on的兼容性问题呢，自己的说法验过了吗？
我不知道.appraisal是什么，不知道你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的上下文，很难说什么东西更致命，只能靠猜，因而没办法帮到具体的忙了。
如果jumpToDetail是跳转到页面里面本身存在的内容区域里，而.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素赋以ID。
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal是一个a标签，那么，增加它的href属性，它就可以有click事件，也会冒泡到document上。
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过（jsFiddle在这里特别慢，所以贴了全部的代码，见谅）：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("click",".appraisal",function(){
alert(this.textContent) ;
$("#new").on("click",function(){
var a = document.createElement("a") ;
a.classList.add("appraisal") ;
a.href= "#" ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
再次更新，就LZ后来补充的需求而言，需要的是下面的方案3。
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件（比如span标签），那么，可以用touchend click做代替。
要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存在touch过程中是否发生了touchmove。
由于touchend事件会触发两次：touchend一次以后，再次按屏幕上任意一个地方都会触发touchend(对双击操作的处理)。因此得在事件处理里面加入setTimeout。(参见)
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1} span{background: #fFC;margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("touchend click",".appraisal",function(evt){
if ( !this.classList.contains("touchmoving") ){
var that =
setTimeout(function(){
// 防止第二次触发touchend
// 你的相应代码
alert(that.textContent) ;
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
$("#new").on("click",function(){
var a = document.createElement("span") ;
a.classList.add("appraisal") ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
更新，刚才发现touchend事件会被触发两遍，所以第三个可能性的方案改为setTimeout里放LZ的代码。
如果jumpToDetail是跳转到页面里面本身存在的内容区域里，而.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素赋以ID。
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal是一个a标签，那么，增加它的href属性，它就可以有click事件，也会冒泡到document上。
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过（jsFiddle在这里特别慢，所以贴了全部的代码，见谅）：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("click",".appraisal",function(){
alert(this.textContent) ;
$("#new").on("click",function(){
var a = document.createElement("a") ;
a.classList.add("appraisal") ;
a.href= "#" ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
可能性多了去了，为何一定会是是jQuery.on的兼容性问题呢，自己的说法验过了吗？
我不知道.appraisal是什么，不知道你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的上下文，很难说什么东西更致命，只能靠猜，因而没办法帮到具体的忙了。
更新，刚才发现touchend事件会被触发两遍，所以第三个可能性的方案改为setTimeout里放LZ的代码。
如果jumpToDetail是跳转到页面里面本身存在的内容区域里，而.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素赋以ID。
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal是一个a标签，那么，增加它的href属性，它就可以有click事件，也会冒泡到document上。
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过（jsFiddle在这里特别慢，所以贴了全部的代码，见谅）：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("click",".appraisal",function(){
alert(this.textContent) ;
$("#new").on("click",function(){
var a = document.createElement("a") ;
a.classList.add("appraisal") ;
a.href= "#" ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件（比如span标签），那么，可以用touchend click做代替。
要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存在touch过程中是否发生了touchmove。
由于touchend事件会触发两次：touchend一次以后，再次按屏幕上任意一个地方都会触发touchend(对双击操作的处理)。因此得在事件处理里面加入setTimeout。(参见)
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1} span{background: #fFC;margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("touchend click",".appraisal",function(evt){
if ( !this.classList.contains("touchmoving") ){
var that =
setTimeout(function(){
// 防止第二次触发touchend
// 你的相应代码
alert(that.textContent) ;
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
$("#new").on("click",function(){
var a = document.createElement("span") ;
a.classList.add("appraisal") ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
可能性多了去了，为何一定会是是jQuery.on的兼容性问题呢，自己的说法验过了吗？
我不知道.appraisal是什么，不知道你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的上下文，很难说什么东西更致命，只能靠猜，因而没办法帮到具体的忙了。
更新，刚才发现touchend事件会被触发两遍，所以第三个可能性的方案改为setTimeout里放LZ的代码。
如果jumpToDetail是跳转到页面里面本身存在的内容区域里，而.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素赋以ID。
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal是一个a标签，那么，增加它的href属性，它就可以有click事件，也会冒泡到document上。
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过（jsFiddle在这里特别慢，所以贴了全部的代码，见谅）：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("click",".appraisal",function(){
alert(this.textContent) ;
$("#new").on("click",function(){
var a = document.createElement("a") ;
a.classList.add("appraisal") ;
a.href= "#" ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件（比如span标签），那么，可以用touchend click做代替。
如果要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存在touch过程中是否发生了touchmove。
由于touchend事件会触发两次：touchend一次以后，再次按屏幕上任意一个地方都会触发touchend(对双击操作的处理)。因此得在事件处理里面加入setTimeout。(参见)
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1} span{background: #fFC;margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("touchend click",".appraisal",function(evt){
if ( !this.classList.contains("touchmoving") ){
var that =
setTimeout(function(){
// 防止第二次触发touchend
// 你的相应代码
alert(that.textContent) ;
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
$("#new").on("click",function(){
var a = document.createElement("span") ;
a.classList.add("appraisal") ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
可能性多了去了，为何一定会是是jQuery.on的兼容性问题呢，自己的说法验过了吗？
我不知道.appraisal是什么，不知道你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的上下文，很难说什么东西更致命，只能靠猜，因而没办法帮到具体的忙了。
更新，刚才发现touchend事件会被触发两遍，所以第三个可能性的方案改为setTimeout里放LZ的代码。
如果jumpToDetail是一个页面里面本身存在的内容，而.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素以ID。
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal是一个a标签，那么，增加它的href属性，它就可以有click事件，也会冒泡到document上。
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过（jsFiddle在这里特别慢，所以贴了全部的代码，见谅）：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("click",".appraisal",function(){
alert(this.textContent) ;
$("#new").on("click",function(){
var a = document.createElement("a") ;
a.classList.add("appraisal") ;
a.href= "#" ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件（比如span标签），那么，可以用touchend click做代替。
如果要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存在touch过程中是否发生了touchmove。
由于touchend事件会触发两次：touchend一次以后，再次按屏幕上任意一个地方都会触发touchend(对双击操作的处理)。因此得在事件处理里面加入setTimeout。(参见)
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1} span{background: #fFC;margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("touchend click",".appraisal",function(evt){
if ( !this.classList.contains("touchmoving") ){
var that =
setTimeout(function(){
// 防止第二次触发touchend
// 你的相应代码
alert(that.textContent) ;
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
$("#new").on("click",function(){
var a = document.createElement("span") ;
a.classList.add("appraisal") ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
可能性多了去了，为何一定会是是jQuery.on的兼容性问题呢，自己的说法验过了吗？
我不知道.appraisal是什么，不知道你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的上下文，很难说什么东西更致命，只能靠猜，因而没办法帮到具体的忙了。
更新，刚才发现touchend事件会被触发两遍，所以第三个可能性的方案改为setTimeout里放LZ的代码。
如果jumpToDetail是一个页面里面本身存在的内容，而.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素以ID。
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal是一个a标签，那么，增加它的href属性，它就可以有click事件，也会冒泡到document上。
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过（jsFiddle在这里特别慢，所以贴了全部的代码，见谅）：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("click",".appraisal",function(){
alert(this.textContent) ;
$("#new").on("click",function(){
var a = document.createElement("a") ;
a.classList.add("appraisal") ;
a.href= "#" ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件（比如span标签），那么，可以用touchend click做代替。
如果要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存在touch过程中是否发生了touchmove。
由于touchend事件会触发两次：touchend一次以后，再次按屏幕上任意一个地方都会触发touchend(对双击操作的处理)。因此得在事件处理里面加入setTimeout。(参见)
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1} span{background: #fFC;margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("touchend click",".appraisal",function(evt){
if ( !this.classList.contains("touchmoving") ){
var that =
setTimeout(function(){
// 防止第二次触发touchend
// 你的相应代码
alert(that.textContent) ;
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
$("#new").on("click",function(){
var a = document.createElement("span") ;
a.classList.add("appraisal") ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
可能性多了去了，为何一定会是是jQuery.on的兼容性问题呢，自己的说法验过了吗？
我不知道.appraisal是什么，不知道你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的上下文，很难说什么东西更致命，只能靠猜，因而没办法帮到具体的忙了。
可以参考的一个测试
更新，刚才发现touchend事件会被触发两遍，所以第三个可能性的方案改为setTimeout里放LZ的代码。
如果jumpToDetail是一个页面里面本身存在的内容，而.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素以ID。
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal是一个a标签，那么，增加它的href属性，它就可以有click事件，也会冒泡到document上。
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过（jsFiddle在这里特别慢，所以贴了全部的代码，见谅）：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("click",".appraisal",function(){
alert(this.textContent) ;
$("#new").on("click",function(){
var a = document.createElement("a") ;
a.classList.add("appraisal") ;
a.href= "#" ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件（比如span标签），那么，可以用touchend mouseup做代替。
如果要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存在touch过程中是否发生了touchmove。
由于touchend事件会触发两次：touchend一次以后，再次按屏幕上任意一个地方都会触发touchend(对双击操作的处理)。因此得在事件处理里面加入setTimeout。(参见)
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1} span{background: #fFC;margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("touchend click",".appraisal",function(evt){
if ( !this.classList.contains("touchmoving") ){
var that =
setTimeout(function(){
// 防止第二次触发touchend
// 你的相应代码
alert(that.textContent) ;
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
$("#new").on("click",function(){
var a = document.createElement("span") ;
a.classList.add("appraisal") ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
可能性多了去了，为何一定会是是jQuery.on的兼容性问题呢，自己的说法验过了吗？
我不知道.appraisal是什么，不知道你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的上下文，很难说什么东西更致命，只能靠猜，因而没办法帮到具体的忙了。
可以参考的一个测试
更新，刚才发现touchend事件会被触发两遍，所以第三个“我猜”的方案改为setTimeout里放LZ的代码。
如果jumpToDetail是一个页面里面本身存在的内容，而.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素以ID。
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal是一个a标签，那么，增加它的href属性，它就可以有click事件，也会冒泡到document上。
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过（jsFiddle在这里特别慢，所以贴了全部的代码，见谅）：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("click",".appraisal",function(){
alert(this.textContent) ;
$("#new").on("click",function(){
var a = document.createElement("a") ;
a.classList.add("appraisal") ;
a.href= "#" ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件（比如span标签），那么，可以用touchend mouseup做代替。
如果要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存在touch过程中是否发生了touchmove。
由于touchend事件会触发两次：touchend一次以后，再次按屏幕上任意一个地方都会触发touchend(对双击操作的处理)。因此得在事件处理里面加入setTimeout。(参见)
在ipad2 + iOs7 + safari/chrome + jQuery1.10.2上测试通过：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1} span{background: #fFC;margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("touchend click",".appraisal",function(evt){
if ( !this.classList.contains("touchmoving") ){
// 你的相应代码
var that =
setTimeout(function(){
// 防止第二次触发touchend
alert(that.textContent) ;
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
$("#new").on("click",function(){
var a = document.createElement("span") ;
a.classList.add("appraisal") ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
可能性多了去了，为何一定会是是jQuery.on的兼容性问题呢，自己的说法验过了吗？
我不知道.appraisal是什么，不知道你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的上下文，很难说什么东西更致命，只能靠猜，因而没办法帮到具体的忙了。
可以参考的一个测试
LZ给出这么粗略的代码，是要玩猜猜看吗？
我猜，如果jumpToDetail是一个页面里面本身存在的内容，如果.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素以ID。
我猜，如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal是一个a标签，那么，增加它的href属性，它就可以有click事件，也会冒泡到document上。
在ipad2 +iOs7+safari+jQuery1.10.2上测试通过（jsFiddle在这里特别慢，所以贴了全部的代码，见谅）：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("click",".appraisal",function(){
alert(this.textContent) ;
$("#new").on("click",function(){
var a = document.createElement("a") ;
a.classList.add("appraisal") ;
a.href= "#" ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
我猜，如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件（比如span标签），那么，可以用touchend mouseup做代替。
如果要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存在touch过程中是否发生了touchmove：
在ipad2+iOs7+safari+jQuery1.10.2上测试通过：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&span{background: #fFC;margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("touchend",".appraisal",function(){
if ( !this.classList.contains("touchmoving") ){
// 你的相应代码
alert(this.textContent) ;
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
$("#new").on("click",function(){
var a = document.createElement("span") ;
a.classList.add("appraisal") ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
我猜，可能性多了去了，为何一定会是是jQuery.on的兼容性问题呢，自己的说法验过了吗？
我猜呀猜，猜不出来.appraisal是什么，是&a&还是什么幺蛾子标签；猜不出来，stopEvent是不是一个可能导致错误的函数；猜不出来你的jQuery版本和iPhone版本……
前端里，兼容性这种东西是步步惊心，根据LZ提供的残缺上下文，很难说什么东西更致命，只能靠猜，因而没办法帮到具体的忙了。
LZ给出这么粗略的代码，是要玩猜猜看吗？
我猜，如果jumpToDetail是一个页面里面本身存在的内容，如果.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素以ID。
我猜，如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal是一个a标签，那么，增加它的href属性，它就可以有click事件，也会冒泡到document上。
在ipad2 +iOs7+safari+jQuery1.10.2上测试通过（jsFiddle在这里特别慢，所以贴了全部的代码，见谅）：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("click",".appraisal",function(){
alert(this.textContent) ;
$("#new").on("click",function(){
var a = document.createElement("a") ;
a.classList.add("appraisal") ;
a.href= "#" ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
我猜，如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件（比如span标签），那么，可以用touchend mouseup做代替。
如果要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存在touch过程中是否发生了touchmove：
在ipad2+iOs7+safari+jQuery1.10.2上测试通过：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&span{background: #fFC;margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("touchend",".appraisal",function(){
if ( !this.classList.contains("touchmoving") ){
// 你的相应代码
alert(this.textContent) ;
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
$("#new").on("click",function(){
var a = document.createElement("span") ;
a.classList.add("appraisal") ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
我猜，可能性多了去了，为何你就一口咬死说是jQuery.on的兼容性问题呢。如果按照你说的，是jQuery.on的兼容性问题，那么你在body上面addEventListener，不就绕开它了吗？你检验过自己的说法吗？
我猜呀猜，猜不出来.appraisal是什么，是&a&还是什么幺蛾子标签；猜不出来，stopEvent是不是一个可能导致错误的函数；猜不出来你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的残缺上下文，很难说什么东西更致命，只能靠猜，因而没办法帮到具体的忙了。
LZ给出这么粗略的代码，是要玩猜猜看吗？
我猜，如果jumpToDetail是一个页面里面本身存在的内容，如果.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素以ID。
我猜，如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal是一个a标签，那么，增加它的href属性，它就可以有click事件，也会冒泡到document上。
在ipad2 +iOs7+safari+jQuery1.10.2上测试通过：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("click",".appraisal",function(){
alert(this.textContent) ;
$("#new").on("click",function(){
var a = document.createElement("a") ;
a.classList.add("appraisal") ;
a.href= "#" ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
我猜，如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件（比如span标签），那么，可以用touchend mouseup做代替。
如果要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存在touch过程中是否发生了touchmove：
$(document).on("touchend",".appraisal",function(){
if ( !this.classList.contains("touchmoving") ){
// 你的相应代码
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
我猜，可能性多了去了，为何你就一口咬死说是jQuery.on的兼容性问题呢。如果按照你说的，是jQuery.on的兼容性问题，那么你在body上面addEventListener，不就绕开它了吗？你检验过自己的说法吗？
我猜呀猜，猜不出来.appraisal是什么，是&a&还是什么幺蛾子标签；猜不出来，stopEvent是不是一个可能导致错误的函数；猜不出来你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的残缺上下文，很难说什么东西更致命，只能靠猜，因而没办法帮到具体的忙了。
LZ给出这么粗略的代码，是要玩猜猜看吗？
我猜，如果jumpToDetail是一个页面里面本身存在的内容，如果.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素以ID。
我猜，如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal是一个a标签，那么，增加它的href属性，它就可以有click事件，也会冒泡到document上。
在ipad2 +iOs7+safari+jQuery1.10.2上测试通过：
&!DOCTYPE html&
&meta http-equiv="Content-Type" content="text/ charset=UTF-8"&
&title&test&/title&
&script type="text/javascript" src="res/jquery-1.10.2.js"&&/script&
&style&a{margin: 1}&/style&
&button id="new"&new&/button&
&script type="text/javascript"&
$(document).on("click",".appraisal",function(){
alert(this.textContent) ;
$("#new").on("click",function(){
var a = document.createElement("a") ;
a.classList.add("appraisal") ;
a.href= "#" ;
a.textContent = Math.random() ;
document.body.appendChild(a) ;
我猜，如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件，那么，可以用touchend mouseup做代替。
如果要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存在touch过程中是否发生了touchmove：
$(document).on("touchend",".appraisal",function(){
if ( !this.classList.contains("touchmoving") ){
// 你的相应代码
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
我猜，可能性多了去了，为何你就一口咬死说是jQuery.on的兼容性问题呢。如果按照你说的，是jQuery.on的兼容性问题，那么你在body上面addEventListener，不就绕开它了吗？你检验过自己的说法吗？
我猜呀猜，猜不出来.appraisal是什么，是&a&还是什么幺蛾子标签；猜不出来，stopEvent是不是一个可能导致错误的函数；猜不出来你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的残缺上下文，很难说什么东西更致命，只能靠猜，因而没办法帮到具体的忙了。
LZ给出这么粗略的代码，是要玩猜猜看吗？
我猜，如果jumpToDetail是一个页面里面本身存在的内容，如果.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素以ID。
我猜，如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件，那么，可以用touchend mouseup做代替。
如果要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存在touch过程中是否发生了touchmove：
$(document).on("touchend",".appraisal",function(){
if ( !this.classList.contains("touchmoving") ){
// 你的相应代码
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
我猜，可能性多了去了，为何你就一口咬死说是jQuery.on的兼容性问题呢。如果按照你说的，是jQuery.on的兼容性问题，那么你在body上面addEventListener，不就绕开它了吗？你检验过自己的说法吗？
我猜呀猜，猜不出来.appraisal是什么，是&a&还是什么幺蛾子标签；猜不出来，stopEvent是不是一个可能导致错误的函数；猜不出来你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的残缺上下文，很难说什么东西更致命，只能靠猜，因而没办法帮到具体的忙了。
LZ给出这么粗略的代码，是要玩猜猜看吗？
我猜，如果jumpToDetail是一个页面里面本身存在的内容，如果.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素以ID。
我猜，如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件，那么，可以用touchend mouseup做代替。
如果要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存在touch过程中是否发生了touchmove：
$(document).on("touchend",".appraisal",function(){
if ( !this.classList.contains("touchmoving") ){
// 你的相应代码
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
我猜，可能性多了去了，为何你就一口咬死说是jQuery.on的兼容性问题呢。如果按照你说的，是jQuery.on的兼容性问题，那么你在body上面addEventListener，不就绕开它了吗？你检验过自己的说法吗？
我猜呀猜，猜不出来.appraisal是什么，是&a&还是什么幺蛾子标签；猜不出来，stopEvent是不是一个可能导致错误的函数；猜不出来你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的残缺上下文，很难说什么东西比较致命，只能靠猜，因而没办法帮到具体的忙了。
LZ给出这么粗略的代码，是要玩猜猜看吗？
我猜，如果jumpToDetail是一个页面里面本身存在的内容，如果.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素以ID。
我猜，如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件，那么，可以用touchend mouseup做代替。
如果要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存是否发生了touchmove：
$(document).on("touchend",".appraisal",function(){
if ( !this.classList.contains("touchmoving") ){
// 你的相应代码
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
我猜，可能性多了去了，为何你就一口咬死说是jQuery.on的兼容性问题呢。如果按照你说的，是jQuery.on的兼容性问题，那么你在body上面addEventListener，不就绕开它了吗？你检验过自己的说法吗？
我猜呀猜，猜不出来.appraisal是什么，是&a&还是什么幺蛾子标签；猜不出来，stopEvent是不是一个可能导致错误的函数；猜不出来你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的残缺上下文，很难说什么东西比较致命，只能靠猜，因而没办法帮到具体的忙了。
LZ给出这么粗略的代码，是要玩猜猜看吗？
我猜，如果jumpToDetail是一个页面里面本身存在的内容，如果.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素以ID。
我猜，如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件，那么，可以用touchend mouseup做代替。
如果要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存是否发生了touchmove：
$(document).on("touchend",".appraisal",function(){
if ( !this.classList.contains("touchmoving") ){
// 你的相应代码
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
我猜，可能性多了去了，为何你就一口咬死说是jQuery.on的兼容性问题呢。如果按照你说的，是jQuery.on的兼容性问题，那么你在document上面addEventListener，不就绕开它了吗？你检验过自己的说法吗？
我猜呀猜，猜不出来.appraisal是什么，是&a&还是什么幺蛾子标签；猜不出来，stopEvent是不是一个可能导致错误的函数；猜不出来你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的残缺上下文，很难说什么东西比较致命，只能靠猜，因而没办法帮到具体的忙了。
LZ给出这么粗略的代码，是要玩猜猜看吗？
我猜，如果jumpToDetail是一个页面里面本身存在的内容，如果.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素以ID。
我猜，如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件，那么，可以用touchend mouseup做代替。
如果要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存是否发生了touchmove：
$(document).on("touchend",".appraisal",function(){
if ( !this.classList.contains("touchmoving") ){
// 你的相应代码
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
我猜，可能性多了去了，为何你就一口咬死说是jQuery.on的兼容性问题呢。如果按照你说的，是jQuery.on的兼容性问题，那么你在document上面addEventListener，不就绕开它了吗？你检验过自己的说法吗？
我猜呀猜，猜不出来.appraisal是什么，是&a&还是什么幺蛾子标签；猜不出来，stopEvent是不是一个可能导致错误的函数；猜不出来你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的残缺上下文，很难说什么东西比较致命，只能靠猜，因而没办法帮到具体的忙了。
LZ给出这么粗略的代码，是要玩猜猜看吗？
我猜，如果jumpToDetail是一个页面里面本身存在的内容，如果.appraisal是一个链接，那么有一个更加简单的做法，是&a href="#xxx"&，然后给相应的元素以ID。
我猜，如果jumpToDetail是一个弹窗之类必须要有JS介入的东西，而.appraisal可能本身不提供click事件，那么，可以用touchend mouseup做代替。
如果要防止滑动的时候不误触发，可以学习去除onclick的300ms延时的方式，使用一种方式缓存是否发生了touchmove：
$(document).on("touchend",".appraisal",function(){
if ( this.classList.contains("touchmoving") ){
// 你的相应代码
this.classList.remove("touchmoving") ;
$(document).on("touchmove",".appraisal",function(){
this.classList.add("touchmoving") ;
我猜，可能性多了去了，为何你就一口咬死说是jQuery.on的兼容性问题呢。如果按照你说的，是jQuery.on的兼容性问题，那么你在document上面addEventListener，不就绕开它了吗？你检验过自己的说法吗？
我猜呀猜，猜不出来.appraisal是什么，是&a&还是什么幺蛾子标签；猜不出来，stopEvent是不是一个可能导致错误的函数；猜不出来你的jQuery版本和iPhone版本……前端里，兼容性这种东西是步步惊心，根据LZ提供的残缺上下文，很难说什么东西比较致命，只能靠猜，因而没办法帮到具体的忙了。
我要该，理由是：}