Отсутствует событие click для <span> внутри элемента <button> в firefox

У меня проблема с Firefox 32, когда я связываю действие с событием click элемента span внутри элемента button. Другие браузеры работают хорошо.

Вот код , иллюстрирующий проблему в jsFiddle.

<span onClick="alert('test');">**Working**</span><br>
<button>inside a button <span onClick="alert('test');">**Not working**</span></button>

Ответы

Ответ 1

Насколько я знаю, нажатие на дочерние элементы не будет работать, потому что оно вложено в кнопку. Кнопка не является контейнером для дочерних элементов - только для текста.

Если вы попробуете, как показано ниже, всегда сообщайте, что вы нажали кнопку.

<button type="button" onclick="alert('You clicked the button!');">
   inside a button <span onClick="alert('clicked span');">**Not working**</span>
</button>

Ответ 2

Вы должны добавить свойство pointer-events к элементу span.

button span {
  pointer-events: none;
}

Ответ 3

Добавьте курсор-событие к вашей кнопке в css, например:

button span {
    pointer-events: none;
}