Prevent typing in Text Field Input, Even Though Field is NOT Disabled/Read-Only

If you wish to make the field complete in-intractable.

$('input').focus(function(e) {
    $(this).blur();
});

Example : https://jsfiddle.net/DinoMyte/up4j39qr/15/


See this fiddle

You can use jQuery for this.. You can do it as below

$('input').keypress(function(e) {
    e.preventDefault();
});

OR

you can just return false instead of using preventDefault(). See the script below

$('input').keypress(function(e) {
    return false
});

See the fiddle

OR

A much simplified version without Javascript would be as below. Just change your HTML as below

<input type="text" onkeypress="return false;"/>

See the fiddle


If you're looking for read-only input, a simple way is to add 'readonly' to the input HTML. For example,

<input type="number" readonly>

With this, it doesn't interfere with form submission or other event listeners. Input with 'readonly' will still be submitted, but not input with 'disabled'.

For references: https://www.w3schools.com/TAGS/att_input_readonly.asp