Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can my input element receive onclick events when it is set to disabled?

I need to have an onclick/hover event on an input tag which is disabled.
Is there another way but to wrap it in another tag and give that tag the events?

<input type="checkbox" onclick="cant_choose('event')" disabled="disabled" value="2" name="enroll_to[event][]">
like image 858
Itay Moav -Malimovka Avatar asked May 12 '10 13:05

Itay Moav -Malimovka


2 Answers

You could simulate it being disabled with JavaScript and CSS.

That is, blur all focus it receives, and add a class with something like so.

input.disabled {
    background: #d4d0c8;
    color: #888;
    cursor: default;
}

Update

See it in comparison with the normal and browser disabled input box on JSbin.

like image 55
alex Avatar answered Oct 20 '22 01:10

alex


You could wrap the input field inside a container and bind the click event on it.

<div id='input-container'>
    <input id='myText' disabled />
</div>

<script>
    $('#input-container').click(function() {
        alert('test');
    });
</script>

http://jsfiddle.net/M2EYH/

If you have multiple disabled fields, and don't want to make an unique ID for each container, you can give the containers a class name instead of an ID.

like image 36
nyuszika7h Avatar answered Oct 20 '22 01:10

nyuszika7h