Sự kiện nhấp không được kích hoạt trên nút có phần tử svg trong Safari

Question

Trong sự kiện nhấp chuột Safari không được kích hoạt trên nút có phần tử svg. Khi bạn bấm vào nút bấm sự kiện nhấp chuột cạnh lửa, nhưng nếu bạn bấm vào yếu tố svg chính nó không.

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

Nó hoạt động nếu tôi đính kèm vào sự kiện như thế này:

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

Bởi vì các nút thêm động tôi không thể làm như thế này;

Ví dụ trong codepen.io http://codepen.io/neilhem/pen/bdGYPq

phiên bản jQuery 2.1.3

Answer 1

Tôi không biết nó là cách tốt nhất để giải quyết vấn đề này, nhưng thêm pointer-events: none; tới SVG yếu tố giải quyết vấn đề.

svg.icon { 
    pointer-events: none; 
}