Onclick event on disabled <td> only works when you click on text, but not when you click on another area in td (ie10, ie11 issue)

Question

I have this html code below.

<table border="1" style="width:100%"> <tr> <th>Col</th></tr> <tr><td onclick="alert('1');" disabled="disabled"><label>One<br></label></td></tr> <tr><td onclick="alert('2');" disabled="disabled"><label>Two<br></label></td></tr> <tr><td onclick="alert('3');" disabled="disabled"><label><br></label></td></tr> </table> 

The above code works in Chrome and Microsoft Edge means that it displays a warning when you click anywhere on the td tag in all three cases.
But in IE10, IE11 it only works when td contains some data, as in the code above. The third line does not give a warning, and for other tds it only works when you click on text, not when you click on any other area inside td, except for text.

This code is part of my large application. I just want to know that this is a known bug in IE, if so, can anyone provide me with a link to this error.
Or am I missing something in the code that causes the problem. Since this is part of a large application, I want to add less code so that it does not affect other applications.

Any help would be appreciated

Answer 1

According to the docs: https://msdn.microsoft.com/en-us/library/ms533732(v=vs.85).aspx ,

Disabled items do not respond to mouse events

I tested your code in IE11 and works without the disabled property. I thought it was a td specific issue, so I added onclick to the div and it works the same way as long as the disabled attribute does not exist.

Check it out on IE11