检测默认事件处理

2024-05-14

是否可以检测特定 DOM 事件是否绑定了任何事件处理程序(包括浏览器默认事件处理)- 在 Firefox 的 Greasemonkey 代码中(EcmaScript 5.1 严格模式 https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Functions_and_function_scope/Strict_mode)?

到目前为止,我设法在选择文本时取消点击事件处理,但是我想在以下所有情况下取消我的事件处理其中点击事件触发默认操作:

  • 选择页面上的文本
  • 显示上下文菜单(即右键单击)
  • 已跟踪链接(左键单击<a>)
  • 表单元素被操纵(文本框获得焦点,光标开始闪烁,单选按钮被选中,...)
  • 处理该事件的其他一些 JavaScript 代码(例如显示弹出帮助对话框)

有没有包罗万象的机制为此还是我需要明确地拼写代码中的所有情况?

以下代码是我检测发生选择的方式:

var toggleHighlight = function(){
    var oldTargt;
    return function(e){
        targt = e.target;
        sel = window.getSelection();
        if (!sel.isCollapsed && sel.containsNode(targt, true)) {
            return;
        }
        ...
        oldTargt = targt;
}()
document.addEventListener('click', toggleHighlight);

Notes:
- I don't want to STOP propagation with my script, I want to stop MY SCRIPT if the event will be propagated to other handler.
- I'm not interested in JQuery-event-handlers-only https://stackoverflow.com/questions/1236067/test-if-event-handler-is-bound-to-an-element-in-jquery solutions if they don't catch default browser event handlers.
- If this feature does not indeed exist, please cite some articles or blogs, not just your own opinion.
- Particular suggestions are welcome, but I'm mainly interested in the existence of a general solution.

Update:可接受的解决方案包括:

  • 详尽的清单if我需要检查的条件
  • 可通过 Firefox 插件访问的非 JavaScript 方式
  • 解释 Firefox 如何知道点击有效<a>元素应该触发新 URL 的重新加载+如何无法从 javascript/插件访问此逻辑

这个问题几乎是重复的“如何仅在 Javascript / jQuery 中没有默认值时执行操作?” https://stackoverflow.com/q/3152075/331508,除了作为一名 Greasemonkey 脚本编写者之外,还有一个(复杂的)选项可供您使用。

从你的问题来看,你似乎想设置一个默认动作 http://www.w3.org/TR/DOM-Level-3-Events/#glossary-default-action对于没有事件处理程序的节点,如果给定事件触发任何其他事件处理程序,则中止该默认操作。对此没有“包罗万象的机制”,几乎您尝试的任何技术都可能会破坏某些页面。原因如下:

  1. javascript 和 Greasemonkey API 都没有提供任何列出给定节点事件的机制。有一个旧提案 https://stackoverflow.com/q/7810534/331508,但从未实施过。

    However,Firefox 附加组件可以通过以下方式列出事件nsIEventListenerService 服务 https://developer.mozilla.org/en-US/docs/XPCOM_Interface_Reference/nsIEventListenerService,所以有一个可能性您可以为该部分编写一个与 Greasemonkey 交互的辅助插件。细节(远远)超出了这个问题的范围。

  2. 同样,没有机制可以从事件链中检测先前事件事件对象 https://developer.mozilla.org/en-US/docs/DOM/event, 除非event.defaultPrevented已设置。 (通常不会。)

  3. 即使您可以列出事件侦听器node X,这对父节点上的后备侦听器没有帮助。现代 JS 库可以(有时确实)使任何旧节点可点击。和/或他们可能会设置一个监听器,比如说,document that gets所有点击事件,但实际上并非如此do除了原始目标是某个特定节点时之外的任何情况。


一个好的妥协策略是跟随另一个问题的引导,不对具有 a 的节点执行任何操作默认动作.
要处理右键单击或中心单击,请选中event.which.

因此,您可以将以下片段添加到您的支票中:

return function(e){
    targt   = e.target;
    sel     = window.getSelection();

    if (e.which != 1) {
        return; //-- Abort on anything that is not a left-click.
    }
    if (e.defaultPrevented) {
        return; //-- The one time we know that some other handler fired.
    }
    if (isInteractiveElement (targt) ) {
        // Do nothing for elements that trigger browser actions
        return; 
    }
    ...

where:

function isInteractiveElement (node) {
    var intElems = [
        //-- Must be uppercase
        "A", "BUTTON", "INPUT", "TEXTAREA", "VIDEO", "MAP", "OBJECT"
    ];
    if (intElems.indexOf (node.nodeName) >= 0) {
        return true;
    }
    else if (node.nodeName === "BODY") {
        return false;
    }

    return isInteractiveElement (node.parentNode);
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

检测默认事件处理 的相关文章

  • 如何将 UIWebView 中的输入的键盘按钮“返回”更改为“搜索”?

    我有一个简单的 HTML 文件 它将显示在 UIWebView 中 p p
  • 附加组件生成器:ContentScript 并返回附加组件代码?

    我正在使用 Firefox Add on Builder 这是我到目前为止所拥有的 main js var widgets require widget var tabs require tabs var data require self
  • 错误:#0 轴的数据列不能是字符串类型

    我正在尝试使用谷歌图表和 React JS 创建散点图 我制作了一个测试数组来检查这是否是将数据发送到图表的正确方法并且它有效 但是当我处理真实数据并创建一个类似的数组时 它给我带来错误 轴 0 的数据列不能是字符串类型 这是运行良好的测试
  • 如何在后台加载图像?

    问题 我正在创建一个专辑 所以每次按 时间 下一个 按钮我正在加载新图像 我想要实现的是 只有在新图像从服务器完全下载后 我才想从旧图像切换到新图像 实际上我不想在加载时显示部分图像 有什么解决办法吗 PS 类似的问题 https stac
  • ExtJs4 Json TreeStore?

    我正在将 ExtJs3 应用程序迁移到 ExtJs4 在 ExtJs3 中 我有一个树网格 它有一个加载器来加载树数据 如下所示 loader new Ext tree TreeLoader dataUrl Department Depar
  • Android 上的 setTimeOut() 相当于什么?

    我需要等效的代码setTimeOut call function milliseconds 对于安卓 setTimeOut call function milliseconds 您可能想查看定时任务 http developer andro
  • 无法使用 Node.JS 将 null 值发送到 MySQL 数据库

    我正在尝试发送null使用 Node JS 到我的 MySQL 数据库 con query INSERT INTO Routes routeTrigger VALUES null title test function err result
  • Internet Explorer 的数组indexOf 实现

    有很多关于如何将 indexOf 实现放入数组原型中以便它可以在 Internet Explorer 下工作的解决方案 但是我偶然发现了一个问题 到目前为止我所看到的任何地方似乎都没有解决这个问题 使用非常一致的MDC 的实施 https
  • 对不同的 Windows 窗体控件使用相同的事件处理程序是否安全?

    这是好的做法吗 我有 3 个 DataGridView 我想要一个允许用户通过单击列标题对数据进行排序的工具 我本来可以为每个 DataGridView 的 ColumnHeaderMouseClick 事件都有一个事件处理程序 但我做了一
  • 与玻璃钢战斗

    我读过有关 FRP 的内容 非常兴奋 它看起来很棒 因此您可以编写更多高级代码 并且一切都更加可组合 等等 然后我尝试用数百个 sloc 从纯 js 到 Bacon 重写我自己的小游戏 我发现 我实际上不是编写高级纯逻辑代码 而是击败了 B
  • 不明白为什么 Chrome/Safari 无法在此处获取 ScrollHeight

    我只是问了一个问题 为什么某些 js 代码不能 100 在 Chrome 和 Safari 中工作 但经过更多故障排除后 我想我发现这是我应该发布的问题 我有一个页面 其中有一个表单 该表单的目标是同一页面上的 iframe iframe
  • 删除 CSS Transitionend 事件侦听器不起作用

    我在尝试删除 css Transitionend 事件侦听器时遇到问题 我可以添加监听器 e addEventListener transitionend function event transitionComplete event pr
  • 需要了解Javascript函数提升示例

    我阅读了 Javascript 提升的概念 它非常令人困惑 但我看到了一些示例并了解了提升的实际作用 所以基本上 提升是 JavaScript 的默认行为 即将所有声明移动到当前作用域的顶部 当前脚本或当前函数的顶部 但我无法理解以下实现
  • 如何从 dataurl 在服务器上创建图像文件

    我有一个 dataurl 格式的图像 例如 data image jpeg base64 9j 4AAQSkZJRgABAQAAAQABAAD 2wBDAAMCAgMCAgMDAwMEAwME iiigAooooAKKKKACiiigAoo
  • 为什么 `BehaviorSubject` 不发出最后一个值

    The 关于BehaviorSubject的文档 http reactivex io documentation subject html声明它应该返回最后发出的值 无论我何时订阅 但它不会为我返回它 const ofObservable
  • Ruby 数组到 Javascript 数组

    我有一个带有帐户 ID 的 Ruby 数组 我想将帐户 ID 的 Ruby 数组存储在 Javascript 数组中 我想知道最好的方法是什么 另外 当我尝试执行此操作时 Javascript 似乎认为如果只输入一个帐户 ID 则该 ID
  • 如何使用 Browserify 获取 html 模板

    我正在尝试找出一种简单的方法 在脚本中需要 html 模板 然后从 CLI 运行 browserify 假设我想获取一个模板并将其附加到正文中 index js var template require template html docu
  • CasperJS:如何单击所有选定的按钮?

    我正在尝试使用 CasperJS 作为网络抓取工具 并且有一个带有按钮的页面 单击该按钮将加载数据 因此 我想先单击所有这些按钮 然后等待 然后再实际进行查询以获取所有必要的数据 问题是对于 Casper casper thenClick
  • 错误:Javascript 上的 [object Object]

    当我在 Firebug 中运行下面的 javascript 时 我不断收到错误 我已经尝试更改多项内容 但它仍然输出错误 我正在使用 api 从 XML 检索信息 然后将其输出到屏幕上 但我不断收到对象错误 有人能看出为什么吗 任何帮助表示
  • angular-cli:Karma-Webpack 因“没有此类文件或目录”而失败

    我从Tour of Heroes使用标准 Angular systemjs 现在我正在使用angular client它在开发 生产模式下运行顺利 但我无法测试任何东西ng test 以下内容会被吐出 不仅适用于test ts但也为了pol

随机推荐