Firefox does not fire omouseover event in img tag of child element of button tag

Firefox 39 does not fire the onmouseover event on the img tag for the following markups:

<button class="btn" type="submit" name="test" value="purchase button">
  <img src="images/test.png" alt="test" onmouseover="alert(1)">
</button>

Chrome 43 fires an event and displays an alert dialog.
How do I make an event fire on Firefox?
Thank you for your cooperation.

html firefox

2022-09-30 20:54

1 Answers

The simplest way is to put on mouseover on the button.

<p>
  mouseover to button>img
  <button class="btn" type="submit" name="test" value="buy button">
    <img src="images/test.png" alt="test" onmouseover="alert(1)">
  </button>
</p>

<p>
  mouseover to button
  <button class="btn" type="submit" name="test" value="buy button"onmouseover="alert(1)">
    <img src="images/test.png" alt="test">
  </button>
</p>

<p>
  img and mouseover
  <img src="images/test.png" alt="test" onmouseover="alert(1)">
</p>

<p>
  mouseover to button>img
  <button class="btn" type="submit" name="test" value="buy button">
    <img src="images/test.png" alt="test" onmouseover="alert(1)">
  </button>
</p>

<p>
  mouseover to button
  <button class="btn" type="submit" name="test" value="buy button"onmouseover="alert(1)">
    <img src="images/test.png" alt="test">
  </button>
</p>

<p>
  img and mouseover
  <img src="images/test.png" alt="test" onmouseover="alert(1)">
</p>

Firefox seems to handle events with the button element.

jQuery event bubbling on button not working as expected in Firefox-Stack Overflow

The next thing I think is to change button to div and implement submit on my own.

2022-09-30 20:54

If you have any answers or tips

Popular Tags

python x 4647

android x 1593

java x 1494

javascript x 1427

c x 927

c++ x 878

ruby-on-rails x 696

php x 692

python3 x 685

html x 656