How can I use jQuery to make an input readonly?

Question

I have the following input:

How c

Answer 1

There are two attributes, namely readonly and disabled, that can make a semi-read-only input. But there is a tiny difference between them.

• The readonly attribute makes your input text disabled, and users are not able to change it anymore.
• Not only will the disabled attribute make your input-text disabled(unchangeable) but also cannot it be submitted.

jQuery approach (1):

$("#inputID").prop("readonly", true);
$("#inputID").prop("disabled", true);

jQuery approach (2):

$("#inputID").attr("readonly","readonly");
$("#inputID").attr("disabled", "disabled");

JavaScript approach:

document.getElementById("inputID").readOnly = true;
document.getElementById("inputID").disabled = true;

PS prop introduced with jQuery 1.6.