Safari 中带有 svg 元素的按钮未触发单击事件

Question

在 Safari 中，没有在带有 svg 元素的按钮上触发点击事件。当您单击按钮时，边缘单击事件会触发，但如果您单击 svg 元素本身，则不会。

$(document).on('click', 'button', function(e) {
    console.log(e);
});

如果我像这样附加点击事件就可以了：

$('button').on('click', function(e) {
    console.log(e);
});

由于按钮是动态添加的，我不能这样做；

codepen.io中的示例http://codepen.io/neilhem/pen/bdGYPq

jQuery版本2.1.3

Answer 1

我不知道这是解决这个问题的最佳方法，但是将 pointer-events: none; 添加到 svg 元素解决了问题。

svg {
  pointer-events: none;
}

Answer 2

svg {
  pointer-events: none;
}

对此有什么更好的解决方案？我经常遇到这种情况。

这对我有用。