我处理的dblclick事件在跨度在我的web应用程序。双击的副作用是,它选择了页面上的文本。我怎样才能阻止这种选择的发生呢?
当前回答
防止双击后才选择文本:
您可以使用MouseEvent#detail属性。 对于mousedown或mouseup事件,它是1加上当前的单击次数。
文档。addEventListener('mousedown',函数(事件){ If (event.detail > 1) { event.preventDefault (); //当然,你还是不知道你在这里阻止了什么… //你也可以检查event.ctrlKey/event.shiftKey/event.altKey //不阻止一些有用的东西。 } },假); 一些虚拟文本
参见https://developer.mozilla.org/en-US/docs/Web/API/UIEvent/detail
其他回答
我也有同样的问题。我通过切换到<a>和添加onclick="返回false;"(这样点击它就不会在浏览器历史记录中添加新的条目)。
在纯javascript中:
element.addEventListener('mousedown', function(e){ e.preventDefault(); }, false);
或者使用jQuery:
jQuery(element).mousedown(function(e){ e.preventDefault(); });
FWIW,我将user-select: none设置为那些我不希望在双击父元素的任何地方时以某种方式被选中的子元素的父元素。它确实有效!很酷的是contentteditable ="true",文本选择等仍然适用于子元素!
就像:
<div style="user-select: none">
<p>haha</p>
<p>haha</p>
<p>haha</p>
<p>haha</p>
</div>
顺风CSS:
<div class="select-none ...">
This text is not selectable
</div>
旧线程,但我提出了一个解决方案,我相信是更干净的,因为它不禁用每个偶数绑定到对象,只防止随机和不需要的文本选择在页面上。这很简单,而且对我来说效果很好。 这里有一个例子;我想防止当我用类“arrow-right”在对象上单击几次时的文本选择:
$(".arrow-right").hover(function(){$('body').css({userSelect: "none"});}, function(){$('body').css({userSelect: "auto"});});
HTH !
推荐文章
- 打印在 JsFiddle 中
- AngularJS只适用于单页应用程序吗?
- Javascript和regex:分割字符串并保留分隔符
- 如何检查DST(日光节约时间)是否有效,如果是,偏移量?
- 如何打破_。在underscore.js中的每个函数
- 如何在jQuery中获得当前日期?
- 如何创建一个日期对象从字符串在javascript
- 输入触发器按钮单击
- 获取对象的属性名
- 如何检查用户是否可以回到浏览器历史
- 相当于字符串。jQuery格式
- 如何在vue-cli项目中更改端口号
- Angular 2模板中的标签是什么意思?
- JavaScript .includes()方法的多个条件
- 窗口。亲近与自我。close不关闭Chrome中的窗口