Question

我有一个函数可以创建附加到svg元素的圆圈。我希望在选择圆圈时触发函数selectCircle(event)。

function addObjects() {
  var demoSVG = document.getElementById("demoSVG");
  demoSVG.appendChild(createCircle(10, 10, 10, 1));
}
function createCircle(startPercent, diffPercent, rPercent, i) {
  var obj = document.createElementNS("http://www.w3.org/2000/svg", "circle");
  obj.setAttribute("id", "obj" + i);
  obj.setAttribute("class", "draggable");
  obj.setAttribute("cx", startPercent + i * diffPercent + "%");
  obj.setAttribute("cy", "90%");
  obj.setAttribute("r", rPercent + "%");
  obj.setAttribute("onmousedown", "selectCircle(event)");
  return obj;
}

这适用于Chrome / Safari，但不适用于Firefox。我得到ReferenceError: event is not defined。我了解它没有看到event，但似乎无法弄清楚如何修复它，因为createCircle()没有与之关联的事件。

任何帮助将不胜感激！

Answer 1

假设在创建圆圈时定义了事件处理程序：

obj.addEventListener("mousedown", selectCircle);

似乎FF不会像对HTML elements那样为SVG元素包装基于属性的事件处理程序。（MDN文档明确说明了“ HTML 属性”。）

如何在Firefox中将事件传递给setAttribute函数

1 个答案: