Активируемый div внутри кнопки не работает в Firefox

Question

У меня есть расширяемый раздел, который является кнопкой (это из рамок, которые я не могу изменить). И внутри этого раздела я получил кликабельный div. Это работает в Chrome, IE, Safari, но не в Firefox.

<button onclick="alert('expand');" class="button">
   <div onclick="alert('Edit');" class="edit">Edit</div><br/>
</button>

https://jsfiddle.net/dLbkq6uy/1/

Я не могу запустить событие click для DIV внутри этой кнопки в Firefox.

Answer 1

В Firefox button сам крадет такие события, как события мыши и щелчок дочернего элемента. Это означает, что вещи внутри кнопок не могут быть нажаты. Это не считается ошибкой, поскольку работает точно так, как задумано.

Источник

Пожалуйста, посетите этот также

Основываясь на вышеупомянутых ссылках, решение для Firefox состоит в том, чтобы заменить button на какой-либо другой элемент, такой как div, и соответственно управлять функциональностью и дизайном.