网站如何阻止选择文本，以及如何取消阻止呢？

74

有一个网站（示例）以某种方式阻止选择文本。它还阻止Ctrl+ A选择所有内容，弹出菜单中也没有“复制”。

我尝试过的

一些网站使用JavaScript阻止选择。因此，我在Firefox的无脚本插件中禁用了所有JavaScript源。我在Google Chrome浏览器中使用Script Safe插件尝试了相同的网站。确保所有内容均被阻止，但仍然无法选择文本。整个网站上，Mousepointer仍然是箭头，而不是文本光标。

用于about:config完全禁用Firefox中的JavaScript。仍然没有效果。

我读到有些网站使用DIV的样式为display：block，因此我使用Inspect检查了网站的样式。整个网站上都没有提到“块”，嵌入式CSS或对象style = -attributes中都没有提及。

文字不是图像，Flash或HTML5画布。一切都在DIV和P标记内，但未找到可能会阻止文本选择的样式。

网站如何仍然阻止任何文本选择？更不用说为什么浏览器完全支持这种行为了。我只想使用选定的单词或句子，并想通过鼠标右键单击在Google中搜索它。当网站执行此类操作并强迫我手动在Google中输入技术术语和名称时，这很烦人。它打扰了我的工作流程。

google-chrome  firefox  browser  javascript 
— 用户名
source
8
“网站如何阻止文字标记” -设置style.userSelect为none。
2
@ Xen2050通常，我不关心复制文本。我只是喜欢标记短语和术语并只需单击一下鼠标即可在Google上搜索的功能（双击单词，右键单击“搜索Google ...”）。我可以进入源代码（如果根本不是干净的源代码），然后搜索该词，将其复制，然后粘贴到Google中，但是很好……正如所说的那样，这很烦人。想要复制您的网站文本的某人可以执行任何操作，但是只希望舒适的工作流程的某人会受到阻碍。
— user6329530
122
我们可以花点时间对所有认为这是一种很好的安全措施的妄想性Web开发人员表示同情吗？
— MCMastery
3
我不知道这种做法的普及程度，但是我记得在几个实例中会拉伸一个单像素图像以覆盖整个页面，以防止复制文本等。然后将鼠标指针更改为闪闪发光的彩虹-独角兽明星以及到处闪烁的文字...
— RIanGillis
27
@MCMastery或更糟糕的是，知道这很糟糕但被告知无论如何都必须这样做的开发人员。大多数时候，他们担心人们会窃取内容。然后，您将拥有像SO这样的网站，这些网站一直都在被刮擦/盗窃……但是在商业上可行。事实证明，疏远用户群对企业不利。谁曾想到？！
— corsiKa

Answers:

81

https://www.angst-panik-hilfe.de/angst-panik.css显示：

body{-webkit-user-select:none;-moz-user-select:-moz-none;
-ms-user-select:none;user-select:none}

因此，该效果适用于整个BODY标签。

此CSS的文档：Mozilla开发人员站点：user-select。

您可以通过在开发人员工具中删除样式（F12在Firefox或Chrome中按）来覆盖此样式-您甚至还可以创建一个JavaScript小程序，在花费时间进行设置后，该程序可以立即花费较少的时间删除该样式您的职责（如果您打算多次访问该站点，则可以节省时间）。

我还要添加此注释：这可能不是至少具有某些效果的唯一方法。另一种可能的方式可能是使包含文本的DIV封面不可见DIV。这样，鼠标光标将不会变成工字梁（文本光标），因为该光标将基于最顶部的内容DIV。（Ctrl- A可能会覆盖该文本。）

当网站执行此类操作并强迫我手动在Google中输入技术术语和名称时，这很烦人。它打扰了我的工作流程。

阿们！看到这一点，我对主要浏览器正在实现的这种CSS样式感到失望。这样的事情确实很烦人！

— TOOGAM
source
61
在user-select当负责任地应用CSS样式是非常有益的。例如，如果您希望（尤其是年龄较大的）用户在触摸屏上单击标签文本附近的按钮，则不希望他们标记标签文本而不是单击按钮。
— phihag
14
您是什么意思“默认”？仅当网站专门启用此设置时，此设置对我而言听起来并不像“默认情况下”。总是会有一些功能会被不良的网页设计师误用，在防止负面影响那些​​确实有正当理由使用这些功能的人的过程中，您可以做很多事情...
— 肖恩·伯顿
11
@SeanT同样，如果存在浏览器来为查看网页的人提供服务，那么它的工作就是响应Web服务器发送的内容，但用户告诉它。如果用户告诉它使页面静音，或者禁止弹出窗口，或者复制文本，那么浏览器应该这样做。
— 累计
8
任何浏览器用户都不会费心配置浏览器来显式启用此类功能，如果默认情况下未启用该功能，则该功能本质上是无用的，也可能根本无法实现。并且如果您建议每个功能都必须由用户显式启用，那么您在哪里划清界限？用户必须在网站显示图像之前启用“图像”功能吗？在用户启用所需的所有功能之前，默认情况下所有浏览器都必须基本上是Lynx吗？
— 肖恩·伯顿
13
@Acccumulation用户选择：不使用任何功能来维持网页的样式，例如，当从下拉列表中选择选项时，停止丑陋的蓝色背景。您只是没有注意到，因为它已正确实施。这里的问题是，它是以对用户的限制性方式实现的，浏览器无法区分两者。因此，怪罪开发人员：)
— 肖恩·T
11

如前所述，user-select: none在页面的CSS中进行设置会导致无法选择页面上的文本。删除该文本选择块的最简单方法是通过如下用户脚本覆盖设置：

// ==UserScript==
// @name         Force Select
// @version      1.0
// @description  Stop sites from disabling selection of text
// @author       You
// @match        *://*/*
// @grant        none
// ==/UserScript==

(function() {
  'use strict';

  let style = document.createElement('style');
  style.innerHTML = '*{ user-select: auto !important; }';

  document.body.appendChild(style);
})();

注意：如果启用此功能，则将适用于每个页面，这在所有情况下都不是理想的。

可以使用Violentmonkey，Tampermonkey或Greasemonkey之类的用户脚本管理器来安装脚本并轻松打开/关闭该脚本。

— 希罗塔
source
9
值得一提的是，您可能需要扩展名（例如'greasemonkey'）来添加用户脚本。
— Stilez
1
This will apply to every page if left enabled, which might not be desirable in all situations.仅在URL匹配特定站点或站点数组时，您是否可以仅将函数嵌套在执行脚本的if语句中？
— Hashim '18年
1
@Hashim没必要；您可以使用一个或多个@match语句指定适用于哪些页面，但是除非您仅访问特定的站点或您始终要修改的一组站点，否则您需要在希望将脚本应用于特定页面时修改脚本。对于示例脚本，我通过将其*://*/*用作URL进行匹配来使其通用，因此它将应用于所有地方。可以从用户脚本管理器的菜单中打开和关闭它。
— Herohtar
10

打开开发人员工具（F12），更改为Elements选项卡，然后取消选中body下面的CSS规则：

  • 用户选择：无；
  • webkit-user-select：无；

演示图片

— JMK
source
7

使用Firefox，有一种非常简单的方法：

View > Page Style > No Style

在德国：

Ansich > Webseiten-Stil > Kein Stil

在此处输入图片说明

下载禁用了右键单击的嵌入式图像也非常有用。

— 埃里克·杜米尼尔
source
1
是的，它也可以在IE11上使用。
— Marco Demaio '18
3

我使用的是Stylus（https://add0n.com/stylus.html），并且我设计了一种适用于所有网站的样式，因此，我确保所有内容都可以选择：

* {
  -webkit-user-select: auto !important;
  -moz-user-select: inherit  !important;
  -ms-user-select: inherit  !important;
  user-select: auto  !important;
}

星号是要确保样式不仅应用于特定的CSS元素（如<body>），而且还应用于所有元素。我遇到了仅将选择阻止应用于按钮文本的情况，因此将for用作css <body>将无济于事。

我使用选择功能在外语网站上进行即时翻译。

— 德雷
source
我修复了内联<body>标签的格式和可见性；参见superuser.com/help/formatting
— Arjan
0

正如其他答案所述，这与页面正文中的CSS有关。虽然您可以每次手动进行编辑，但是如果您经常使用此网站，我建议您使用Chrome浏览器，则应安装Fashionally扩展程序。

时髦的允许您创建其他CSS来应用于页面。它可以在整个网络上使用。它具有每次访问网站时都会自动应用的好处（因此，您不需要在每次页面加载时都通过开发工具来添加它）。

安装后，单击工具栏中的图标，然后选择“创建新样式”。它将自动为您当前访问的网站创建条目。然后，您可以将任何您喜欢的CSS添加到页面。但请注意：某些样式可能不可重写（特别是如果样式写在元素本身而不是CSS类上）。

在这种情况下，您可以使用导入功能，并添加以下代码，这应允许您选择链接到的网站上的文本。

@-moz-document domain("www.angst-panik-hilfe.de") {
  body {
    -webkit-user-select: auto !important;
    -moz-user-select: inherit  !important;
    -ms-user-select: inherit  !important;
    user-select: auto  !important;
  }
}
— 黑曜石凤凰
source
为仅在firefox上运行的内容添加webkit和ms前缀有点...多余。
— 斯蒂芬·比杰斯特
@StephanBijzitter是的，我只是改写了页面上已经与用户选择有关的所有样式。但是话又说回来，这确实意味着不使用chrome但具有类似扩展名的用户可以很容易地复制此类并获得相同的好处而无需工作-但这并不会真正损害解决方案。
— 黑曜石凤凰
0

建议的几种解决方案可能是特定于浏览器的，因此值得提出一些替代方案：

  1. 使用更尊重您的浏览器。

    一种。Emacs具有浏览器emacs-w3m，eww并且将始终允许人们选择文本。

    b。其他基于文本的浏览器，如lynx，elinks和w3m，可能允许一个选择文本，但即使没有，如果在一个终端窗口中运行这些程序，可以使用自己的鼠标选择文本。而且，如果您从内部使用这些程序tmux，tmux即使没有鼠标，也可以使用的功能复制文本。

  2. 使用命令行工具以可读的文本格式下载整个URL。

    一种。 w3m -dump [your_url] > your_file.txt

    b。lynx -dump [your_url] > your_file.txt。我通常更喜欢这个，因为它将超链接标记为可读的脚注！

— 用户1404316
source
0

安装附加组件“绝对启用右键单击并复制”，该附加组件将启用其他No Script附加组件不能提供的所有功能。

— 克里斯
source
0

只需创建以下CSS样式：

html, body {
    user-select: text;
}

有一个名为“ 时尚”的扩展程序，该扩展程序允许您在您选择的任何网站中安装该（或任何其他）css代码。只需输入上面的CSS代码，然后告诉您要将其应用到哪个网站，就可以了。此扩展程序可在Chrome，百度，Firefox和Opera上使用。如果您碰巧使用IE，那么您就不走运了。但是您已经知道不是吗。

— 阿卡拉
source
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.