在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ 列表做了拖拽滾動以后,列表內(nèi)表單的默認事件不起作用

列表做了拖拽滾動以后,列表內(nèi)表單的默認事件不起作用

圖片描述

這樣的一個列表,因為要展示的字段太多了,我自己封裝了左右拖拽滾動的方法,因為mousedown的時候阻止默認事件。列表內(nèi)的表單的focus,blur等默認事件都不起作用。去掉mousedown里的return false就正常了。但是拖拽的時候火狐和ie下會選中文字。改如何解決才能正常拖拽滾動不選中文字,同時表單的默認事件正常。
拖拽滾動的方法:
var el = this.$(selector)
var doc = this.$(document)
el.on('mousedown', function (ev) {

var preX =  ev.clientX
var Left = el.scrollLeft()
doc.on('mousemove.drag', function (ev) {
  var disX = preX - ev.clientX
  Left += disX
  el.scrollLeft(Left)
  preX = ev.clientX
  return false
})
return false

})
doc.on('mouseup', function (ev) {

doc.off('mousemove.drag')

})

回答
編輯回答
挽歌

拖拽的控制點放在表頭上。不要放在table body。

推薦一個插件:https://www.ag-grid.com/examp...

2017年8月11日 15:44
編輯回答
蟲児飛

沒想到比較好的解決辦法,試了一下這么干:mousedown時不return false或者preventDefault,然后阻止列表里面文字部分被選中,這樣左右拖動能帶動滾動條正常滾動,不過假如用戶想選中文字復制就不行了。應(yīng)該還有更好的解決辦法,找到了來補充,如果有大神有更好的思路歡迎探討

2018年3月13日 01:41