How to set the input text box of a form to be non-editable

How to set the form input text box to be non-editable: first create the corresponding code file; then set the form field to "onfocus=this.blur(), readonly, disabled" to achieve the non-editable function. Can.

What this article brings to you is to use the input text box as an example to introduce how to set the form to be non-editable, so that everyone can understand how to implement all form fields ( Text box, label, check box, text area) non-editable method, know the difference between readonly attribute and disabled attribute. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

Sometimes, we need to display form fields in non-editable mode, so how to achieve this? We can achieve the non-editable function of the form by setting the following methods for the form fields (input text box, label, check box, text area). [Recommended related video tutorials: html tutorial]

Let’s take the input text box as an example to see the effect:

1, onfocus=this.blur( )

<input type="text" name="input1" value="php中文网" onfocus=this.blur()>

It can be seen that the form input text box cannot be clicked and cannot be edited; the text inside cannot be selected.

2. readonly attribute

<input type="text" name="input1" value="php中文网" readonly> 

<input type="text" name="input1" value="php中文网" readonly="true">

It can be seen that the form input text box cannot be clicked and cannot be edited. .

3. disabled attribute

<input type="text" name="input1" value="php中文网" disabled>

Note:

We cannot do it for everyone Set the readonly attribute on a form field or element. The , and elements do not have a readonly attribute, but they have a disabled attribute, which can be set to achieve non-editable functionality.

Let’s take a lookWhat is the difference between the readonly attribute and the disabled attribute?

The readonly attribute and the disabled attribute are both non-editable attributes of form fields (text boxes, labels, check boxes, text areas). Let’s take a look at their differences

disabled attribute----Disabled attribute

1. Disabled form fields or element values ​​will not be published to the server for processing.

2. Disabled form fields or elements will not receive focus.

3. Disabled form fields or elements will be skipped during tab navigation.

4. Some browsers (such as IE) provide default styles (gray or embossed text) for disabled form fields or elements.

readonly attribute----Read-only attribute

1. The value of the field or element is published to the server in read-only form for processing.

2. Read-only form fields or elements can get focus.

3. Contain read-only form fields or elements during tab navigation.

4. Some browsers do not provide default styles for read-only form fields or elements.

Summary: The above is the entire content of this article, I hope it will be helpful to everyone's study.

The above is the detailed content of How to set the input text box of a form to be non-editable. For more information, please follow other related articles on the PHP Chinese website!