HTML text box (text) is not available in multiple ways to achieve read-only

HTML text box (text) is not available in multiple ways to achieve read-only
Method 1: <input id= "File1" type= "text" disabled/> Unavailable Method 2: <input id= "File1" type= "text" readonly/> Read-only Method 3: <input id= "File1" type= "text" style="display:none"/> Hidden (but takes up space)
Method 4: <input id="File1" type="text" style="visibility:hidden"/> hidden (does not take up space)

Sometimes, we want the text boxes in the form to be read-only so that users cannot modify the information in them, such as making the content of <input type="text" name="input1" value="中国">, the word "中国" cannot be modified. To summarize, there are several ways to implement it.

Method 1: onfocus=this.blur()

Copy code
The code is as follows:

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

Method 2: readonly

Copy code
The code is as follows:

<input type="text" name="input1" value="中国" readonly>
<input type="text" name="input1" value="中国" readonly="true">

Method 3: disabled

Copy code
The code is as follows:

<input type="text" name="input1" value="中国" disabled>

<<:  MySQL Query Cache Graphical Explanation

>>:  Analysis of the problem of deploying vue project and configuring proxy in Nginx

Recommend

The difference between GB2312, GBK and UTF-8 in web page encoding

First of all, we need to understand that GB2312, ...

Oracle VM VirtualBox installation of CentOS7 operating system tutorial diagram

Table of contents Installation Steps Environment ...

Summary of 10 advanced tips for Vue Router

Preface Vue Router is the official routing manage...

js to realize simple shopping cart function

This article example shares the specific code of ...

How to explain TypeScript generics in a simple way

Table of contents Overview What are Generics Buil...

Where is mysql data stored?

MySQL database storage location: 1. If MySQL uses...

Solve the problem that VMware15 centos7 bridge mode ssh suddenly cannot be accessed

Because I want the virtual machine to have its ow...

Introduction to the method attribute of the Form form in HTML

1 method is a property that specifies how data is ...

How to solve the problem of MySQL query character set mismatch

Find the problem I recently encountered a problem...

Share some uncommon but useful JS techniques

Preface Programming languages ​​usually contain v...

Solve the problem of case sensitivity of Linux+Apache server URL

I encountered a problem today. When entering the ...

Introducing multiple custom fonts in CSS3

Today I found a problem in HTML. There are many d...

Linux MySQL root password forgotten solution

When using the MySQL database, if you have not lo...

How to understand semantic HTML structure

I believe everyone knows HTML and CSS, knows the ...

CSS to achieve the sticky effect of two balls intersecting sample code

This is an effect created purely using CSS. To pu...