重新加載網頁時，拖動事件不起作用

Question

我在我的代碼中使用了hammer.js插件進行拖拽事件，它在頁面首次加載時正常工作，但在重新加載相同頁面時不起作用。爲什麼？

（函數（）{

$.fn.touchpanzoom = function() { 

var $img = $(this) 
var zoomer = $img.panzoom() 
var hammer = new Hammer($img.get(0), { 
    prevent_default: true 
}) 

applyDragFunction(zoomer, hammer) 

}

功能applyDragFunction（伸縮鏡頭，錘）{

var dragTimer = null 
var lastDrag = { 
    x: 0, 
    y: 0 
} 

var currentDrag = { 
    x: 0, 
    y: 0 
} 

function updateDrag() { 
    var x = lastDrag.x - currentDrag.x 
    var y = lastDrag.y - currentDrag.y 
    lastDrag.x = currentDrag.x 
    lastDrag.y = currentDrag.y 
    zoomer.pan(x, y, 0)  
} 

hammer.ondragstart = function(e) { 
    lastDrag.x = 0 
    lastDrag.y = 0  
    dragTimer = setInterval(updateDrag, 20) 
    return false 
} 
hammer.ondrag = function(e) { 
    currentDrag.x = e.distanceX  
    currentDrag.y = e.distanceY 
    return false 
} 

hammer.ondragend = function() { 
    clearInterval(dragTimer) 
    updateDrag() 
    return false 
} 

} } （） ）

Please visit this site to download the Plugin

Answer 1

更改}())至})();）這確實看起來很可疑。

已更新。

(function() { 

$.fn.touchpanzoom = function() { 

var $img = $(this) 
var zoomer = $img.panzoom() 
var hammer = new Hammer($img.get(0), { 
    prevent_default: true 
}) <--- add() here 

這是一個合法的代碼片斷嗎？爲什麼不每次都打電話呢？現在，它看起來像你只是添加了一段代碼（它應該在加載時運行一次，而不是在重新加載時運行）。我認爲這是問題。