JQuery UI可选插件:当div溢出时,使滚动条不可选

前端之家收集整理的这篇文章主要介绍了JQuery UI可选插件:当div溢出时,使滚动条不可选前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个div设置为溢出:自动;这个div的内容是可以选择的(使用jQuery UI).

当div溢出并出现滚动条时,滚动条本身就可以选择,因此滚动效果不佳.在FF / Chrome中,我可以滚动div,但我可以选择轮廓.在Safari中,由于可选择的处理程序选择了点击,所以滚动条将不会完成.

有可以使用选择器将滚动条添加到“取消”项列表中吗?还是以其他方式防止滚动条被选择?

以下是我如何配置我的可选div的代码片段:

@H_403_8@$(".mySelectable").selectable( { cancel: '.myButton,.notSelectable',filter: '.rowSelectable',selecting: function(event,ui){ handleSelection(ui.selecting); },selected: function(event,ui) { handleSelected(ui.selected); },unselected: function(event,ui) { handleUnselected(ui.unselected); } });

我的HTML看起来像:

@H_403_8@<div class="mySelectable"> <!-- set to auto overflow --> <div class="myButton">I can't be selected</div> <div class="rowSelectable">I am a selectable row</div> ... </div>

理想情况下,我正在寻找可以添加到“取消”选项的东西,这有助于跳过滚动条.

解决方法

D’哦!解决方案很简单 – 添加另一个div,没有设置溢出.
所以,html变成: @H_403_8@<div class="wrapperDiv"> <!-- set to auto overflow --> <div class="mySelectable"> <!-- NOT set to overflow --> <div class="myButton">I can't be selected</div> <div class="rowSelectable">I am a selectable row</div> ... </div> </div>

猜你在找的jQuery相关文章