【问题标题】:How to re-enable right click so that I can inspect HTML elements in Chrome?如何重新启用右键单击以便我可以检查 Chrome 中的 HTML 元素?
【发布时间】:2014-02-15 14:13:21
【问题描述】:

我正在查看一个已覆盖右键单击按钮以显示其自己的弹出 HTML 元素的网页。

这使我无法使用 Chrome 开发者工具检查元素。

有人知道我可以从 Chrome 控制台注入的 JavaScript sn-p 重新启用右键单击?

我可以打破现有的“右键单击”功能,以便能够轻松检查 HTML 元素。

谢谢。

【问题讨论】:

  • 如果您使用 firebug for firefox,您仍然可以用鼠标突出显示元素...我知道这意味着使用 Firefox,但它可能会有所帮助。
  • @Teemu Firebug Lite 在 Chrome 上可用。不知道为什么你需要在默认工具上使用它。
  • @JoshSmickus 这个问题用 [google-chrome] 标记,OP 也询问如何使用 Chrome 开发者工具 来检查元素。

标签: javascript google-chrome


【解决方案1】:

截至 2019 年 8 月,此 bookmarlet 可在 Google 网站/Youtube 中使用(在 Chrome 和 Firefox 中测试):

function enableContextMenu(aggressive = false) { 
void(document.ondragstart=null); 
void(document.onselectstart=null); 
void(document.onclick=null); 
void(document.onmousedown=null); 
void(document.onmouseup=null); 
void(document.body.oncontextmenu=null); 
enableRightClickLight(document); 
if (aggressive) { 
  enableRightClick(document); 
  removeContextMenuOnAll("body"); 
  removeContextMenuOnAll("img"); 
  removeContextMenuOnAll("td"); 
  } } 

function removeContextMenuOnAll(tagName) { 
var elements = document.getElementsByTagName(tagName); 
  for (var i = 0; i < elements.length; i++) { 
    enableRightClick(elements[i]); 
  } 
} 

function enableRightClickLight(el) { 
  el || (el = document); 
  el.addEventListener("contextmenu", bringBackDefault, true); 
} 

function enableRightClick(el) { 
  el || (el = document); 
  el.addEventListener("contextmenu", bringBackDefault, true); 
  el.addEventListener("dragstart", bringBackDefault, true); 
  el.addEventListener("selectstart", bringBackDefault, true); 
  el.addEventListener("click", bringBackDefault, true); 
  el.addEventListener("mousedown", bringBackDefault, true); 
  el.addEventListener("mouseup", bringBackDefault, true); 
} 

function restoreRightClick(el) { 
  el || (el = document); 
  el.removeEventListener("contextmenu", bringBackDefault, true); 
  el.removeEventListener("dragstart", bringBackDefault, true); 
  el.removeEventListener("selectstart", bringBackDefault, true); 
  el.removeEventListener("click", bringBackDefault, true); 
  el.removeEventListener("mousedown", bringBackDefault, true); 
  el.removeEventListener("mouseup", bringBackDefault, true); 
} 
function bringBackDefault(event) {
  event.returnValue = true; 
  (typeof event.stopPropagation === 'function') && 
  event.stopPropagation(); 
  (typeof event.cancelBubble === 'function') && 
  event.cancelBubble(); 
} 

enableContextMenu();

对于讨厌的网站,将积极设置/传递为 true(这将禁用大多数事件处理程序并因此禁用与页面的交互):

function enableContextMenu(aggressive = true) { 
  void(document.ondragstart=null);
  void(document.onselectstart=null);
  void(document.onclick=null);
  void(document.onmousedown=null);
  void(document.onmouseup=null); 
  void(document.body.oncontextmenu=null); 
  enableRightClickLight(document); 
  if (aggressive) {
    enableRightClick(document);
    removeContextMenuOnAll("body");
    removeContextMenuOnAll("img");
    removeContextMenuOnAll("td");
  }
} 

function removeContextMenuOnAll(tagName) {
 var elements = document.getElementsByTagName(tagName);
 for (var i = 0; i < elements.length; i++) { enableRightClick(elements[i]);
  }
} 

function enableRightClickLight(el) { 
  el || (el = document); 
  el.addEventListener("contextmenu", bringBackDefault, true); 
}

function enableRightClick(el) {
  el || (el = document);
  el.addEventListener("contextmenu", bringBackDefault, true); 
  el.addEventListener("dragstart", bringBackDefault, true); 
  el.addEventListener("selectstart", bringBackDefault, true); 
  el.addEventListener("click", bringBackDefault, true); 
  el.addEventListener("mousedown", bringBackDefault, true); 
  el.addEventListener("mouseup", bringBackDefault, true); 
} 

function restoreRightClick(el) {
  el || (el = document);
  el.removeEventListener("contextmenu", bringBackDefault, true); 
  el.removeEventListener("dragstart", bringBackDefault, true); 
  el.removeEventListener("selectstart", bringBackDefault, true); 
  el.removeEventListener("click", bringBackDefault, true); 
  el.removeEventListener("mousedown", bringBackDefault, true); 
  el.removeEventListener("mouseup", bringBackDefault, true);
} 

function bringBackDefault(event) {
  event.returnValue = true;
  (typeof event.stopPropagation === 'function') && 
  event.stopPropagation();
  (typeof event.cancelBubble === 'function') &&
  event.cancelBubble(); 
} 

enableContextMenu();

【讨论】:

    【解决方案2】:

    如果其他 cmets 都不起作用,就这样做,打开控制台命令行并输入:

    document.oncontextmenu = null;
    

    【讨论】:

      【解决方案3】:

      在导航到页面之前打开检查模式。 成功了。呵呵

      【讨论】:

        【解决方案4】:

        在 Chrome 开发人员工具工具栏的最左侧有一个按钮,您可以通过该按钮选择要检查的项目,而不管上下文菜单处理程序如何。它看起来像square with arrow pointing to the center

        【讨论】:

          【解决方案5】:

          如果您所在的页面有 texttextarea 输入,请单击此输入(就像您要输入文本一样)然后 右键单击 并选择“检查元素”。

          【讨论】:

            【解决方案6】:

            我在@Chema 解决方案的基础上添加了重置pointer-eventsuser-select。如果为图像将它们设置为 none,则右键单击它不会调用图像的上下文菜单以及用于查看或保存它的选项。

            javascript:function enableContextMenu(aggressive = true) { void(document.ondragstart=null); void(document.onselectstart=null); void(document.onclick=null); void(document.onmousedown=null); void(document.onmouseup=null); void(document.body.oncontextmenu=null); enableRightClickLight(document); if (aggressive) { enableRightClick(document); removeContextMenuOnAll('body'); removeContextMenuOnAll('img'); removeContextMenuOnAll('td'); } } function removeContextMenuOnAll(tagName) { var elements = document.getElementsByTagName(tagName); for (var i = 0; i < elements.length; i++) { enableRightClick(elements[i]); enablePointerEvents(elements[i]); } } function enableRightClickLight(el) { el || (el = document); el.addEventListener('contextmenu', bringBackDefault, true); } function enableRightClick(el) { el || (el = document); el.addEventListener('contextmenu', bringBackDefault, true); el.addEventListener('dragstart', bringBackDefault, true); el.addEventListener('selectstart', bringBackDefault, true); el.addEventListener('click', bringBackDefault, true); el.addEventListener('mousedown', bringBackDefault, true); el.addEventListener('mouseup', bringBackDefault, true); } function restoreRightClick(el) { el || (el = document); el.removeEventListener('contextmenu', bringBackDefault, true); el.removeEventListener('dragstart', bringBackDefault, true); el.removeEventListener('selectstart', bringBackDefault, true); el.removeEventListener('click', bringBackDefault, true); el.removeEventListener('mousedown', bringBackDefault, true); el.removeEventListener('mouseup', bringBackDefault, true); } function bringBackDefault(event) { event.returnValue = true; (typeof event.stopPropagation === 'function') && event.stopPropagation(); (typeof event.cancelBubble === 'function') && event.cancelBubble(); } function enablePointerEvents(el) {  if (!el) return; el.style.pointerEvents='auto'; el.style.webkitTouchCallout='default'; el.style.webkitUserSelect='auto'; el.style.MozUserSelect='auto'; el.style.msUserSelect='auto'; el.style.userSelect='auto'; enablePointerEvents(el.parentElement); } enableContextMenu();
            

            【讨论】:

            • 这有效,而第一个解决方案没有(在缩放屏幕录制页面上尝试)
            【解决方案7】:

            您好,我有一个较短的版本。这与最佳答案相同。 (它适用于 chrome 74.03)

            document.querySelectorAll('*').forEach(e => e.oncontextmenu = null)
            

            【讨论】:

              【解决方案8】:

              我发现最简单的方法是以阅读模式打开网页(支持阅读模式的浏览器,如 Safari、Firefox 等),然后照常复制

              【讨论】:

                【解决方案9】:

                在 Chrome 60.0.3112.78 中测试。

                上述一些方法有效,但我认为最简单的方法是:

                1. 打开开发工具(Shift+Control+i)。

                2. 选择“元素”选项卡,然后选择“事件侦听器”选项卡。

                3. 将鼠标悬停在元素/侦听器上。将显示“删除”按钮。

                4. 点击“删除”。

                例如见照片。

                【讨论】:

                • @Omar 对于这个特定的站点,他们已经做了一些工作来尝试停止复制。在 Chrome 中,在 URL 栏中按 Ctrl+Shift+I 可以获得控制台。我能够通过删除所有事件侦听器(选择“祖先”并删除所有内容,body 标签上有一些额外的),从正文中删除“不可选择”类并更改“用户选择”来使选择和复制工作正常自动进入 html 样式。
                • 为我工作;遍历侦听器并将它们全部删除!
                【解决方案10】:

                我解决这个问题的方法是删除页面上的事件监听器。在我这样做之后,我能够复制文本并将其粘贴到我选择的处理器中。

                【讨论】:

                  【解决方案11】:

                  你可以使用javascript:void(document.oncontextmenu=null); 打开浏览器控制台并运行上面的代码。它会关闭鼠标右键的阻塞

                  【讨论】:

                    【解决方案12】:

                    另一种可能的方式,当用jquery做阻塞函数时,使用:

                    $(document).unbind();
                    

                    它会清除所有动态属性的 onmousedown 和 contextmenu 事件,不能用 document.contextmenu=null 删除;等等

                    【讨论】:

                    • 对我来说也一样,一些代码做了重新绑定:$(document).bind("contextmenu",function(e){if(!$('#easyy').length)e.preventDefault();});
                    【解决方案13】:

                    您可以使用以下代码重新启用鼠标右键单击。

                    document.oncontextmenu = function(){}
                    

                    您可以使用快捷键 (Ctrl+Shift+i) 在 windows OS 中的 chrome 中打开检查元素。

                    【讨论】:

                    • 这就像一个魅力!如果你必须像我一样经常这样做,你可以将它添加为书签: 创建一个新书签,并将其作为 URL: javascript:(document.oncontextmenu = function(){})() 现在,每次你有一个困扰您的页面,只需单击书签即可完成。
                    • 这是最好的答案。非常感谢。
                    【解决方案14】:

                    只需按 F12

                    转到来源

                    您会在此处找到启用右键单击。点击它。

                    在此下方,您将找到 web_accessible_resource

                    在这个打开它你会发现index.js

                    Ctrl + F 并搜索 disabelRightClick。在那里你会发现

                            var disableRightClick = false;  
                    

                    这一行。将此行替换为

                            var disableRightClick = true;
                    

                    只需按 Ctrl + s

                    !!完毕。现在您的右键单击已启用!

                    【讨论】:

                      【解决方案15】:

                      我刚刚访问了this 网站,它真的让我很烦,

                      显然有几种方法可以禁用鼠标点击:

                      1)

                      <script language="javascript">
                      document.onmousedown=disableclick;
                      status="Right Click Disabled";
                      function disableclick(event)
                      {
                        if(event.button==2)
                         {
                           alert(status);
                           return false;    
                         }
                      }
                      </script>
                      

                      <body oncontextmenu="return false">
                      

                      ...

                      在这种情况下,您必须在开发工具中做的是:

                      document.removeEventListener("onmousedown",disableclick);
                      document.oncontextmenu = function(){}
                      

                      2)

                      使用 Flash 作为内容包装器 - 除了截屏之外没有其他解决方案

                      3)

                      一些网站希望阻止通过右键单击下载图像 -> 将图像另存为

                      所以他们所做的就是这样写:

                      <div style="background-image: url(YourImage.jpg);">
                         <img src="transparent.gif"/>
                      </div>
                      

                      这是一个在屏幕的整个宽度和高度上散布的透明图像,您只需转到元素检查器并找到 div 并将其删除。

                      就我而言,#1 成功了

                      【讨论】:

                        【解决方案16】:

                        在 Chrome 中禁用“设置 > 隐私 > 不允许 JavaScript”将启用右键单击功能并允许 Firebug 控制台工作;但也会禁用所有其他 JavaScript 代码。

                        正确的做法是只禁用特定的 JavaScript;查找以下任何代码行:

                        • 功能禁用点击
                        • 函数点击...返回false;
                        • body oncontextmenu="return false;"

                        【讨论】:

                          【解决方案17】:

                          如果他们刚刚更改了 oncontextmenu 处理程序(这是最直接的方法),那么您可以删除他们的覆盖:

                          window.oncontextmenu = null;
                          

                          否则,如果附加到单个元素上,则可以获取页面的所有元素,然后移除每个元素上的处理程序:

                          var elements = document.getElementsByTagName("*");
                          for(var id = 0; id < elements.length; ++id) { elements[id].oncontextmenu = null; }
                          

                          或者,您似乎可以关闭此类脚本; via an extension in Chromeoption in Firefox - 在 javascript 选项的高级框中,关闭“禁用或替换上下文菜单”。

                          【讨论】:

                          • 我认为您走在正确的道路上...但是我刚刚测试过它并不起作用...
                          • 那我建议你找到他们使用的机制并在这里发布,以便我们看看如何消除它。该扩展程序最有可能起作用。
                          • 它可以工作,并且注意 onselectstart 可以重新启用突出显示
                          • 如何启用“左键单击”?
                          • 我按 F12 然后使用控制台,您的第二个脚本运行良好,谢谢
                          【解决方案18】:

                          最简单的方法是按 Cmd + Opt + I (Mac) 或 F12 (PC) 打开开发工具。然后,您可以使用搜索(放大镜,开发工具工具栏的左上角)来选择元素。

                          【讨论】:

                          • 谢谢,但在这个阶段我也想重新启用道具......不是解决方法
                          • 或者可以做 Ctrl (Cmd) + Shift + C 直接打开'元素选择'功能
                          猜你喜欢
                          • 2011-11-28
                          • 2014-09-14
                          • 2017-11-20
                          • 1970-01-01
                          • 2013-07-25
                          • 2013-09-17
                          • 1970-01-01
                          • 1970-01-01
                          • 2016-04-21
                          相关资源
                          最近更新 更多