Can not set readonly on input field in IE

Question

I have a simple input field:

and some JQuery code:

$(e.curre         


        

Answer 1

Okay, this is bizarre: If you make the field read-only while it has focus, IE11 seems to go a bit bonkers, and one of the ways it goes bonkers is to let you keep modifying the field while the cursor is there — with some keystrokes, but not others. Here's an example: Fiddle

$("#myInput").one("click", function(e) {
    $(e.currentTarget).prop('readonly', true);
    display("e.currentTarget.readOnly: " + e.currentTarget.readOnly);
});
$("#myInput").on("keydown", function(e) {
    display("e.currentTarget.readOnly: " + e.currentTarget.readOnly);
});
function display(msg) {
    $("<p>").html(String(msg)).appendTo(document.body);
}

Adding this line before setting readOnly fixes it (fiddle):

$(e.currentTarget).blur();

---

Side note: You don't need jQuery to set the readOnly property, just:

e.currentTarget.readOnly = true; // Note the capital O

Answer 2

'Read-only' input element doesn't work consistently in IE 8,9, 10 or 11.

In this case, we can use onkeydown="javascript: return false;" in the input element.

Answer 3

I have used Focusin() function in jquery side with Id. When I click on textbox then we remove readony attribute as below:

HTML:

<input type="text" id="txtCustomerSearch" readonly class="customer-search" 
   placeholder="Search customer:" maxlength="100" autocomplete="off">

Jquery:

$("#txtCustomerSearch").focusin(function () {
    $(this).removeAttr('readonly');

});

Note: it will working in IE11 and other browser.