鼠標事件在移動設備中不起作用

Question

我創建了這個360度全景圖像 ，該圖像在桌面上可以正常工作，但是在手機上，鼠標事件不起作用。 如何解決此問題？

//聽眾

document.addEventListener("mousedown", onDocumentMouseDown, false);
document.addEventListener("mousemove", onDocumentMouseMove, false);
document.addEventListener("mouseup", onDocumentMouseUp, false);

我將事件更改為

document.addEventListener("touchstart", onDocumentMouseDown, false);
document.addEventListener("touchmove", onDocumentMouseMove, false);
document.addEventListener("touchend", onDocumentMouseUp, false);

但這不適用於移動設備。

Answer 1

對於手機，請嘗試這樣。 您必須使用deviceready函數進行初始化。

document.addEventListener("deviceready", init, false);

function init() {   
    document.querySelector("#yourbuttonId").addEventListener("touchstart", onDocumentMouseDown, false)
}

此事件對於任何應用程序都是必不可少的。 它表明Cordova的設備API已加載並且可以訪問。

Cordova由兩個代碼庫組成：本機代碼和JavaScript。 在加載本機代碼時，將顯示自定義加載圖像。 但是，僅在DOM加載后才加載JavaScript。 這意味着在相應的本機代碼可用之前，Web應用程序可能會調用Cordova JavaScript函數。

一旦Cordova完全加載，設備就緒事件就會觸發。 事件觸發后，您就可以安全地調用Cordova API。 一旦加載了HTML文檔的DOM，應用程序通常會將事件監聽器與document.addEventListener附加在一起。

deviceready事件的行為與其他事件有所不同。 在deviceready事件觸發后注冊的任何事件處理程序都會立即調用其回調函數。

http://docs.phonegap.com/en/4.0.0/cordova_events_events.md.html#deviceready

閱讀此鏈接。

謝謝。

Answer 2

我找到了答案。 對於觸摸event.clientX和event.clientY無法正常工作，我將其更改為event.touches [0] .clientX和event.touches [0] .clientY，它修復了觸摸事件問題。