In JavaScript, disabling the input field mainly restricts the users from interacting with the input elements, and also prevents the modifications to the form elements such as buttons or input fields.

We can use various methods and attributes to disable the input.

Using disabled attribute

In this approach, we are using the disabled property of JavaScript to set the disabled attribute of the input field to render it in an uneditable form so that it cannot accept input from the users.

Syntax:

element.disabled = true;

Example: The below example uses a disabled attribute to disable input in JavaScript.

Output:

Using readOnly attribute

In this approach, we are using the JavaScript readOnly property to set the readOnly attribute to the input field. This makes the input field uneditable while visually indicating that it is in a read-only state and cannot be editable.

Syntax:

element.readOnly = true;

Example: The below example uses the readOnly attribute to disable input in JavaScript.

Output: