如何将自定义事件添加到 svg.js

Question

我正在测试 svg.js library, and have found problems declaring custom events. Here is the fiddle。单击第一个圆圈应该会更改颜色并且有效：

circleOne.click(function() {
  this.fill({ color: '#f06' })
})

点击第二个圆圈应该会触发自定义事件，但它不会：

var circleTwo = SVG.select('circle.circle-01');

circleTwo.on('myevent', function() {
  alert('ta-da!')
})

function testMe() {
  circleTwo.fire('myevent')
}

将 .fire 更改为 .event 也无济于事。有什么建议么？提前致谢。

Answer 1

您永远不会使用 testMe 函数来触发您的事件:)

当事件发生时，浏览器定义的事件已经被触发，对于自定义事件，您已经正确定义了它触发时发生的事情（警报），但如果您想让它在某个时候关闭，您必须触发它。您还制作了触发器功能，但您从未使用过它。

您可以在浏览器定义的触发器上触发它，但只需使用这些事件即可，不要定义自定义。

自定义事件适用于不同的用例。例如，您检测到一个对象在 10 秒内未被触及，并且您想通知代码的其他部分对其做出反应。默认情况下未定义该事件，您可以定义它并使用自定义代码检查在满足条件时触发事件。

尝试触发您的事件，例如点击事件或只是为了测试将其放在 scrypt 的末尾：

testMe();

现在您已经在脚本加载到那个点并执行触发函数时触发了自定义事件。

如何将自定义事件添加到 svg.js

how to add custom events to svg.js

javascript

svg.js