溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
本篇文章和大家了解一下JS的鼠標監聽mouseup鼠標抬起失效如何解決。有一定的參考價值，有需要的朋友可以參考一下，希望對大家有所幫助。
由于很少使用除了click的監聽事件，今天在使用mouseup時遇到一個坑，找了好久的bug。事情是這樣的，我在寫一個表情框，為了實現鼠標拖動表情框時，移動到相應的位置。所以配合使用到了mousedown和mouseup和mosemove。
1.mosedown: 用于鼠標按下進行選中該表情區域為可拖動；
2.mosemove：鼠標移動時，判斷表情區域是否可拖動，，若可拖動，則開始允許拖動；
3.mouseup: 鼠標抬起該表情區域不可拖動；
但是我遇到的問題是，鼠標按下時，該表情區域可以拖動，但是鼠標松開時，表情區域還是可以根據我的鼠標位置進行拖動。
如下：
![上傳中...]()
可以看到，我鼠標松開時，本來不可以移動的，但是現在卻可以移動，后來研究了一下，發現表情區域怎么被我選中變色了，然后查了一下使用css禁止選中，就正常了。如下：
// 表情盒子樣式
.emojiBox {
-webkit-user-select: none;
-moz-user-select: none;
-o-user-select: none;
user-select: none;
}
其實mouseup并沒有失效，而是你拖動時，鼠標選中了其他的元素，其實的話，鼠標即使松開，瀏覽器內部還是認為用戶在復制文字，鼠標還是按下的狀態，所以不會觸發mouseup事件。
以上就是JS的鼠標監聽mouseup鼠標抬起失效如何解決的簡略介紹，當然詳細使用上面的不同還得要大家自己使用過才領會。如果想了解更多，歡迎關注億速云行業資訊頻道哦！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
