之前也看了很多朋友的文章里有講這個問題。比如使用一個變量記錄執行的間隔時間什么的。感覺每次都要去擼一下，比較累人。本人喜歡搬磚前先選工具。其實解決這個方法很簡單。iScroll呢其實是截獲了點擊瀏覽器時的touchstart和touchend事件。在touchend的時候使用js去觸發元素的onclick事件(_end這個函數)。而在實際操作中，先執行了touchend，然后再執行了一次onclick的相關函數。這樣就形成了頭疼的一次點擊兩次觸發。這本來就一個不是問題的問題。之所以說這是個問題，是因為這樣是我們不得不去看一看iScroll的源代碼。解決這個問題的途徑就是拒絕第二次執行函數。而我的邏輯也正是如此。我們可以在執行完_end函數中的觸發click事件的代碼后，移除onclick事件上綁定的函數。然后在定時幾百毫秒之后在重新把這個事件添加上去。舉個例子：
代碼如下:
//處理之前
<span onclick="test()">雙擊測試</span>
//處理之后
<span onclick="void(0)">雙擊測試</span>
在移除onclick相關函數之后這個第二次就自然不會再觸發test函數了。為了下一次還能繼續使用我們可以使用setTimeout的方式把onclick的內容還原回去。
改造后的iscroll源代碼(約550行~570行的樣子，_end函數中)：
代碼如下:
that.doubleTapTimer = setTimeout(function () {
that.doubleTapTimer = null;
// Find the last touched element
target = point.target;
while (target.nodeType != 1) target = target.parentNode;
if (target.tagName != 'SELECT' && target.tagName != 'INPUT' && target.tagName != 'TEXTAREA') {
ev = doc.createEvent('MouseEvents');
ev.initMouseEvent('click', true, true, e.view, 1,
point.screenX, point.screenY, point.clientX, point.clientY,
e.ctrlKey, e.altKey, e.shiftKey, e.metaKey,
0, null);
ev._fake = true;
target.dispatchEvent(ev);
/**以下代碼為新增代碼**/
//找到綁定click事件的元素。
var obj = $(target).attr("onclick") != null ? $(target) : $(target).parents("[onclick]")[0];
if (obj != null) {
var clickContent = $(obj).attr("onclick");
if (clickContent != "void(0)") {
//利用新的屬性來存儲原有的click函數
$(obj).attr("data-clickbak", $(obj).attr("onclick"));
//改變onclick屬性值。
$(obj).attr("onclick", "void(0)");
//防止暴力點擊
if (that.hashBox.length>0) {
for (var _i = 0; _i < that.hashBox.length; _i++)
{
if (that.hashBox[_i] == $(obj)) {
that.hashBox.splice(_i, 1);
break;
}
}
}
that.hashBox.push($(obj));
that._clickBack();
}
}//end
}
}, that.options.zoom ? 250 : 0);
_clickBack函數及hashBox代碼片段（加在_end函數之前）
代碼如下:
hashBox: [],
/*還原被點擊對象的事件*/
_clickBack: function () {
var that = this;
setTimeout(function () {
if (that.hashBox.length > 0) {
var obj = that.hashBox.pop();
obj.attr("onclick", obj.attr("data-clickbak"));
if (that.hashBox.length > 0) that._clickBack();
}
}, 500);
}