javascript：禁用文本选择
[英]javascript: Disable Text Select
问题描述
I'm using javascript to disable text selection on my webiste.
我正在使用 javascript 在我的网站上禁用文本选择。
The code is:代码是：
<script type="text/JavaScript">
function disableselect(e) {
return false
}
function reEnable() {
return true
}
document.onselectstart = new Function ("return false")
if (window.sidebar) {
document.onmousedown = disableselect
document.onclick = reEnable
}
</script>
Similar script can be foundhere类似的脚本可以在这里找到
On my localhost: All Browsers (Firefox, Chrome, IE and Safari) work great.在我的本地主机上：所有浏览器（Firefox、Chrome、IE 和 Safari）都运行良好。
On my Live site: All ok EXCEPT Firefox.在我的 Live 网站上：一切正常，除了 Firefox。
My questions are:我的问题是：
Does anyone have a suggestion as to why Firefox behaves differently for the live site and local host.
有没有人对为什么 Firefox 对实时站点和本地主机的行为有所不同有任何建议。 Note: Javascript is enabled.注意：Javascript 已启用。Maybe my script is too simplistic so I've tried the following with EXACTLY SAME Results
也许我的脚本太简单了，所以我尝试了以下完全相同的结果
6 个解决方案
解决方案1
226 2013-05-29 04:52:30
Just use this css method:只需使用此 css 方法：
body{
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
You can find the same answer here: How to disable text selection highlighting using CSS?您可以在这里找到相同的答案： 如何使用 CSS 禁用文本选择突出显示？
解决方案2
30 2017-02-23 14:54:42
I'm writing slider ui control to provide drag feature, this is my way to prevent content from selecting when user is dragging:我正在编写滑块 ui 控件以提供拖动功能，这是我防止用户拖动时选择内容的方法：
function disableSelect(event) {
event.preventDefault();
}
function startDrag(event) {
window.addEventListener('mouseup', onDragEnd);
window.addEventListener('selectstart', disableSelect);
// ... my other code
}
function onDragEnd() {
window.removeEventListener('mouseup', onDragEnd);
window.removeEventListener('selectstart', disableSelect);
// ... my other code
}
bind startDrag on your dom:在你的 dom 上绑定startDrag ：
<button onmousedown="startDrag">...</button>
If you want to statically disable text select on all element, execute the code when elements are loaded:如果要在所有元素上静态禁用文本选择，请在加载元素时执行代码：
window.addEventListener('selectstart', function(e){ e.preventDefault(); });
解决方案3
11 2014-12-12 00:00:17
For JavaScript use this function:对于 JavaScript，请使用此函数：
function disableselect(e) {return false}
document.onselectstart = new Function (return false)
document.onmousedown = disableselect
to enable the selection use this:要启用选择，请使用：
function reEnable() {return true}
and use this function anywhere you want:并在您想要的任何地方使用此功能：
document.onclick = reEnable
解决方案4
5 2018-05-03 11:02:52
If you got a html page like this:如果你有一个这样的 html 页面：
<body
onbeforecopy = "return false"
ondragstart = "return false"
onselectstart = "return false"
oncontextmenu = "return false"
onselect = "document.selection.empty()"
oncopy = "document.selection.empty()">
There a simple way to disable all events:有一种简单的方法可以禁用所有事件：
document.write(document.body.innerHTML)
You got the html content and lost other things.您获得了 html 内容并丢失了其他内容。
解决方案5
5 2018-12-19 22:19:54
One might also use, works ok in all browsers, require javascript:也可以使用，在所有浏览器中都可以正常工作，需要 javascript：
onselectstart = (e) => {e.preventDefault()}
Example:例子：
onselectstart = (e) => { e.preventDefault() console.log("nope!") }
Select me!
One other js alternative, by testing CSS supports, and disable userSelect , or MozUserSelect for Firefox.另一种 js 替代方案，通过测试 CSS 支持，并为 Firefox 禁用userSelect或MozUserSelect 。
let FF if (CSS.supports("( -moz-user-select: none )")){FF = 1} else {FF = 0} (FF===1) ? document.body.style.MozUserSelect="none" : document.body.style.userSelect="none"
Select me!
Pure css, same logic.纯css，相同的逻辑。 Warning you will have to extend those rules to every browser, this can be verbose.警告您必须将这些规则扩展到每个浏览器，这可能很冗长。
@supports (user-select:none) { div { user-select:none } } @supports (-moz-user-select:none) { div { -moz-user-select:none } }
<div>Select me!</div>
解决方案6
0 2018-09-19 04:44:00
Simple Copy this text and put on the before </body>简单 复制这段文字放在之前</body>
function disableselect(e) {
return false
}
function reEnable() {
return true
}
document.onselectstart = new Function ("return false")
if (window.sidebar) {
document.onmousedown = disableselect
document.onclick = reEnable
}
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.