很抱歉，如果這是一個重復的問題，但我找不到任何答案。
基本而言，我正在開發一個 Web 應用程式，其中有一個按鈕。
我希望該按鈕能夠在兩種不同的情況下高亮顯示：
--如果用戶處于不同的環境中，那么該按鈕就會高亮顯示。
-如果用戶使用的是非觸摸（桌面）設備，那么如果滑鼠在其上方，該按鈕將高亮顯示，而當滑鼠不在其上方時，將恢復正常。
-如果用戶是在沒有滑鼠的觸摸設備上，如果按鈕被觸摸到，它將被高亮顯示，當觸摸停止時，它將恢復正常。
桌面部分作業正常，但觸摸部分有一個問題：要讓按鈕恢復正常，我必須在點擊后點擊其他地方，只是停止觸摸螢屏是不行的。
我做錯了什么？謝謝！
JS代碼：
if (!this.isTouch) {
document.getElementById("search_button"/span>)。 addEventListener("mouseover", function () {
highlightButton（）。
});
document.getElementById("search_button"/span>)。 addEventListener("mouseout", function() {
restoreButton（）。
});
}
else if （window. matchMedia("(any-pointer: none)"/span>).matches) {
document.getElementById("search_button") 。 addEventListener("touchstart", function () {
highlightButton（）。
});
document.getElementById("search_button"/span>)。 addEventListener("touchend", function () {
restoreButton（）。
});
uj5u.com熱心網友回復：
嘗試同時結合touchcancel事件：
addEventListener( "touchcancel", function ( event) {
console.log( "BREAK" ) 。
restoreButton（）。
}, false )。
uj5u.com熱心網友回復：
還有幾個觸摸事件也被列出，可能對你有用，這擴展了觸摸設備，如平板電腦和手機：
el.addEventListener("touchstart", handleStart, false) 。
el.addEventListener("touchend", handleEnd, false)。
el.addEventListener("touchcancel", handleCancel, false)。
el.addEventListener("touchmove", handleMove, false)。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/321015.html
標籤：