Trying to prevent input into textarea

Question

I'm trying to prevent user input into a textarea with Javascript.

Why doesn't this work?

$("textarea").on("input", function (e) {
  console.log("returning"); //This prints
  e.preventDefault();
  return false;
  //Even though this code runs when text is inputed into the textarea, it still doesn't prevent user input. Shouldn't returning false do that?
});

Answer 1

You are preventing the default action of a noncancelable event, not the input. You need to disable the input to get the desired result, disable the input programatically:

$("textarea").prop("disabled", (1 === 2)/*some condition*/);

Answer 2

Input Event : The DOM input event is fired synchronously when the value of an <input>, <select>, or <textarea> element is changed.

Use keydown instead of input for this purpose :

$('textarea').keydown(function(e) {
  console.log("returning"); //This prints
  e.preventDefault();
  return false;
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<textarea></textarea>

Answer 3

If you really don't want a cursor to even appear over your Element, then you should not use a textarea or input at all, but if you must, you can do this:

<textarea readonly='readonly'></textarea>

or

$('textarea').attr('readonly', 'readonly');