如何使用JavaScript临时禁用文本选择?

时间:2021-01-19 17:27:56

this is a bit of a specific question so I'll get right to the point.

这是一个特定问题,所以我会说得对。

I'm working on a short and simple drag and drop routine for part of a web application, and although the dragging and dropping bit works fine, the site goes all ugly-tastic during the operation because the browser still does the default operation and works on text selecting.

我正在为一个Web应用程序的一部分做一个简短而简单的拖放例程,尽管拖放位工作正常,但是在操作期间该网站变得非常丑陋,因为浏览器仍然执行默认操作并且工作正常在文本选择上。

I've tried a few solutions mainly involving returning false from the mousedown or click events, and although they disable text selection in some browsers, they also seem to disable the mouseup event entirely, ruining the "drop" bit of the script and leaving this perma-floating icon hanging around the mouse-- not fun.

我尝试了一些主要涉及从mousedown或click事件返回false的解决方案,虽然它们在某些浏览器中禁用了文本选择,但它们似乎也完全禁用了mouseup事件,破坏了脚本的“drop”位并留下了这个鼠标悬浮在鼠标周围 - 不好玩。

I don't really want text selection to be gone entirely, I just want to suggest that the browser... not do it while dragging, if that makes sense. Since I know the area that is affected (there are iframes involved) I can easily apply a property to the affected elements, etc. I can post code if necessary, but I'm looking for more of a general solution. Since this is an aesthetics thing only, I'm looking for a fix that works in most browsers, it's not really that crucial.

我真的不希望文本选择完全消失,我只想建议浏览器......拖动时不要这样做,如果这有意义的话。由于我知道受影响的区域(涉及iframe),我可以轻松地将属性应用于受影响的元素等。如果需要,我可以发布代码,但我正在寻找更多的通用解决方案。由于这只是一种美学的东西,我正在寻找一种适用于大多数浏览器的修复程序,它并不是那么重要。

Thanks!

谢谢!

2 个解决方案

#1


18  

In W3C browsers, you can call the preventDefault method on the event object. The IE equivalent is to set the returnValue to false.

在W3C浏览器中,您可以在事件对象上调用preventDefault方法。 IE等价物是将returnValue设置为false。

function stopDefault(e) {
    if (e && e.preventDefault) {
        e.preventDefault();
    }
    else {
        window.event.returnValue = false;
    }
    return false;
}

EDIT: Just re-read the question and you might also want to prevent the default action in the part of your code that handles the actual dragging, and not just at the initial mousedown or click.

编辑:只需重新阅读问题,您可能还希望阻止代码中处理实际拖动的部分中的默认操作,而不仅仅是初始的mousedown或click。

#2


0  

as far I know, dragged element must be positioned over other elements under mouse pointer. If it will moving with the mouse pointer, it prevent any selections on the page.

据我所知,拖动元素必须位于鼠标指针下的其他元素上。如果它将使用鼠标指针移动,则会阻止页面上的任何选择。

#1


18  

In W3C browsers, you can call the preventDefault method on the event object. The IE equivalent is to set the returnValue to false.

在W3C浏览器中,您可以在事件对象上调用preventDefault方法。 IE等价物是将returnValue设置为false。

function stopDefault(e) {
    if (e && e.preventDefault) {
        e.preventDefault();
    }
    else {
        window.event.returnValue = false;
    }
    return false;
}

EDIT: Just re-read the question and you might also want to prevent the default action in the part of your code that handles the actual dragging, and not just at the initial mousedown or click.

编辑:只需重新阅读问题,您可能还希望阻止代码中处理实际拖动的部分中的默认操作,而不仅仅是初始的mousedown或click。

#2


0  

as far I know, dragged element must be positioned over other elements under mouse pointer. If it will moving with the mouse pointer, it prevent any selections on the page.

据我所知,拖动元素必须位于鼠标指针下的其他元素上。如果它将使用鼠标指针移动,则会阻止页面上的任何选择。