Clicking on a disabled radio button

Question

I want to disable a radio button but to be able to get the on-click event when it is disabled. Then I enclose the radio button in a div:

<div id="div_radio" display="block"><input type="radio" id="radio"/></div>

and I do, for example:

$("#div_radio").click(function(){
  $(this).hide();
});

You can try it here: http://jsfiddle.net/stla/6CKwk/2/

It works but one has to click not exactly on the radio button, and that is my problem. I have found several related questions on SO, but as a newbie in html/javascript it is possible that I have misunderstood some solutions.

Answer 1

You could use pointer-events CSS property on modern browsers:

DEMO jsFiddle

$("#button").click(function(){
  $("#radio").prop('disabled',true).css('pointer-events','none');
});