0

What I need is a disabled input which would fire events. But since Firefox doesn't support that, I'd like to emulate it somehow.

Which basically means, disallow editing and hide caret. I don't care about appearance.

I've seen this CSS used: user-select: none; But that's not what I want - 1) user can still edit 2) I want it to be selectable.

I don't want the approach of overlaying really disabled input with a and catching it's events - it's not well portable.

Related: Event on a disabled input

Community
  • 1
  • 1
Ondra Žižka
  • 40,240
  • 36
  • 196
  • 259

2 Answers2

1

You can basically cancel every keydown event on the input. However this would still show the carret:

<input type="text" id="disabled_input" />

jQuery:

$('disabled_input').keydown(function (event) {
    event.preventDefault();
    event.stopPropagation();
    // or simply return false;
});

Javascript:

document.getElementById('disabled_input').onkeydown = function (event) {
    event.preventDefault();
    event.stopPropagation();
    // or simply return false;
};
Konstantin Dinev
  • 32,797
  • 13
  • 71
  • 95
1

Why don't you wrap it in another element and place the event handler on that element?

For instance

<div class="disabledwrapper">
    <input type="text" disabled="disabled" name="test" value="test" />
</div>
Ben McCormick
  • 24,338
  • 12
  • 50
  • 71
  • Because Firefox doesn't send click events. They are not fired at all, nowhere in DOM. And I need click event to e.g. navigate to a URL contained in the input. – Ondra Žižka Jan 07 '13 at 16:21