在 Firefox 中运行的 event.path 未定义 [英] event.path is undefined running in Firefox

问题描述

当我在 Firefox 中运行 event.path[n].id 时，出现此错误.它适用于其他浏览器.

<块引用>

event.path 未定义

解决方案

Event 对象的 path 属性是非标准的.标准的等效项是 composedPath，这是一个方法.但它是新的.

所以你可能想尝试回到那个，例如:

var path = event.path ||(event.composedPath && event.composedPath());如果(路径){//你得到了一些路径信息} 别的 {//此浏览器不提供路径信息}

显然，如果浏览器不提供路径信息，它不会为您提供路径信息，但它允许旧方式和新的标准方式，因此将尽其所能地跨浏览器.

示例:

document.getElementById("target").addEventListener("click", function(e) {//仅用于演示目的如果(e.path){如果(e.composedPath){console.log("支持`path`和`composedPath`");} 别的 {console.log("支持`path`但不支持`composedPath`");}} else if (e.composedPath) {console.log("支持`composedPath`(但不支持`path`)");} 别的 {console.log("既不支持`path`也不支持`composedPath`");}//根据上面的，如果可以的话，获取路径var path = e.path ||(e.composedPath && e.composedPath());//如果我们得到它，就显示它如果(路径){console.log("路径(" + path.length + ")");Array.prototype.forEach.call(小路，功能(条目){控制台日志(条目.节点名称)；});}}, false);

点击我

在我的测试中(2018 年 5 月更新)，IE11 和 Legacy Edge(v44 或更早版本，在从 v79 开始的 Chromium 更新之前)都不支持 path 或 composedPath.Firefox 支持 composedPath.Chrome 支持 path(这是谷歌最初的想法)和 composedPath.根据 MDN 所有主要浏览器的最新版本，除了截至 2020 年 1 月，IE11 支持 composedPath.

所以我认为你不能直接在 IE11(或 Legacy Edge)上获取路径信息.显然，您可以通过 e.target.parentNode 和每个后续的 parentNode 获取路径，通常 是相同的，但是当然path/composedPath 的要点在于它并不总是相同(如果在触发事件之后但在您的处理程序被调用之前修改了 DOM).

When I run event.path[n].id in Firefox, I get this error. It works in other browsers.

event.path undefined

解决方案

The path property of Event objects is non-standard. The standard equivalent is composedPath, which is a method. But it's new.

So you may want to try falling back to that, e.g.:

var path = event.path || (event.composedPath && event.composedPath());
if (path) {
    // You got some path information
} else {
    // This browser doesn't supply path information
}

Obviously that won't give you path information if the browser doesn't supply it, but it allows for both the old way and the new, standard way, and so will do its best cross-browser.

Example:

document.getElementById("target").addEventListener("click", function(e) {
  // Just for demonstration purposes
  if (e.path) {
    if (e.composedPath) {
      console.log("Supports `path` and `composedPath`");
    } else {
      console.log("Supports `path` but not `composedPath`");
    }
  } else if (e.composedPath) {
    console.log("Supports `composedPath` (but not `path`)");
  } else {
    console.log("Supports neither `path` nor `composedPath`");
  }
  
  // Per the above, get the path if we can
  var path = e.path || (e.composedPath && e.composedPath());
  
  // Show it if we got it
  if (path) {
    console.log("Path (" + path.length + ")");
    Array.prototype.forEach.call(
      path,
      function(entry) {
        console.log(entry.nodeName);
      }
    );
  }
}, false);

<div id="target">Click me</div>

In my tests (updated May 2018), neither IE11 nor Legacy Edge (v44 or earlier, before the Chromium update that starts with v79) supports either path or composedPath. Firefox supports composedPath. Chrome supports both path (it was Google's original idea) and composedPath. According to MDN recent versions of all major browsers apart from IE11 support composedPath as of January 2020.

So I don't think you can get the path information directly on IE11 (or Legacy Edge). You can, obviously, get the path via e.target.parentNode and each subsequent parentNode, which is usually the same, but of course the point of path/composedPath is that it's not always the same (if something modifies the DOM after the event was triggered but before your handler got called).

这篇关于在 Firefox 中运行的 event.path 未定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！