Make textarea readonly with jquery

For text input I do:

$('input[type="text"]').each(function(){
  $(this).attr('readonly','readonly');
});

But what should I do for textarea, to make it readonly.

Solution 1:

Include it in your selector (using a multiple/element selector), like this:

$('input[type="text"], textarea').attr('readonly','readonly');

You can test it here, if it's the only thing you're doing, there's no need for a .each(), you can just call .attr() on all matched elements.

Solution 2:

In latest versions of jQuery, the use of method prop is preferred over use of attr.

To make a particular textarea readonly:
$('#mytextarea1').prop('readonly', true);

To make all textareas readonly:
$('textarea').prop('readonly', true);

To make all 'text' fields readonly:
$('input[type=text]').prop('readonly', true);

To make all 'text' fields and textarea readonly:
$('input[type=text],textarea').prop('readonly', true);

Please also note the difference between 'readonly' and 'disabled' in terms of appearance:

Below is a <textarea> with disabled set to true:
(looks different from a regular textarea)

Below is a <textarea> with readonly set to true:
(looks same as a regular textarea)

Solution 3:

From Jquery 1.6 use

$("#mytxtarea").prop("disabled", true);

Visit http://api.jquery.com/prop/

Solution 4:

Try this

$("#mytxtarea").attr("disabled", "disabled");

Solution 5:

http://www.w3schools.com/TAGS/att_textarea_readonly.asp
How to select all textareas and textboxes using jQuery?