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
Personalized and creative website design examples (30)
Therefore, we made a selection of 30 combinations ...
Multiple ways to calculate age by birthday in MySQL
I didn't use MySQL very often before, and I w...
Solution to MySQL Chinese garbled characters problem
1. The Chinese garbled characters appear in MySQL...
Some key points of website visual design
From handicraft design to graphic design to web de...
Detailed explanation of the solution to image deformation under flex layout
Flex layout is a commonly used layout method nowa...
Write a simple calculator using JavaScript
The effect is as follows:Reference Program: <!...
Turn off the AutoComplete function in the input box
Now we can use an attribute of input called autoco...
15 JavaScript functions worth collecting
Table of contents 1. Reverse the numbers 2. Get t...
HTML+CSS3 code to realize the animation effect of the solar system planets
Make an animation of the eight planets in the sol...
Example code of how to create a collapsed header effect using only CSS
Collapsed headers are a great solution for displa...
JavaScript closure details
Table of contents 1. What is a closure? 2. The ro...
React implements a highly adaptive virtual list
Table of contents Before transformation: After tr...
Implementation of Nginx configuration of local image server
Table of contents 1. Introduction to Nginx 2. Ima...
3 common errors in reading MySQL Binlog logs
1. mysqlbinlog: [ERROR] unknown variable 'def...
Vue implements multi-tab component
To see the effect directly, a right-click menu ha...