Home > Web Front-end > HTML Tutorial > How to get the value of the input tag in HTML? Detailed explanation on the usage of input value

How to get the value of the input tag in HTML? Detailed explanation on the usage of input value

寻∝梦
Release: 2018-08-28 17:59:50
Original
14106 people have browsed it

This article mainly talks about the usage and value of the value attribute of the HTML input tag, as well as the associated values ​​of the value attribute of the input tag. Let’s take a look at this article together

First let’s take a look at the usage of the input tag in HTML:

The value attribute is the specified value of the input element .

For different types of input elements, the usage of the value attribute is also different:

For "button", "reset", "submit" types - define the text on the button

For "text", "password", "hidden" types - define the initial (default) value of the input field

For "checkbox", "radio", "image" types - define the values ​​related to the input element value. This value is sent to the form's action URL.

Note: The value attribute is required for and .

Note: The value attribute does not apply to .

Having said so much, let’s take a look at an example:

A form with a predefined value for the value attribute:

<form action="demo_form.asp" method="get">
  请输入用户名: <input type="text" name="fname" value="Bill" /><br />
  第二次用户名: <input type="text" name="lname" value="Gates" /><br />
  <input type="submit" value="提交" />
</form>
Copy after login

The effect is shown in the figure:

How to get the value of the input tag in HTML? Detailed explanation on the usage of input value

The above picture is the result of the code, which is the defined form.

Now let’s take a look at the associated value:

Take the input box as an example, can each box be input? This content is the value associated with the input box. If you set a value attribute for it, then the value you set is its value, which will be displayed in the input box. Similarly, a radio button can also set a value, but this value is not displayed like an input box if you set it, but setting it means it has such a value, just like marking whether it is male or female. It may not be possible to tell whether it is a boy or a girl, but it can be marked.

Sometimes you need to adjust an input tag from one position to another. The value of the input after adjustment is the value of the value attribute in the input tag. If the way you modify the value does not modify the value attribute, then adjust The value you set will be lost.

<form> 
<input id="input" type="input" value=&#39;2&#39;></input> 
</form>
Copy after login

So if you have the above operation, please make sure that the way you modify the value changes the value attribute of the input, or use other methods to achieve the above operation, such as jQuery's clone method.

Another checkbox method for the input tag:

<form action="demo-form.php">
  <input type="checkbox" name="vehicle[]" value="Bike">我会PHP<br>
  <input type="checkbox" name="vehicle[]" value="Car">我会html<br>
  <input type="checkbox" name="vehicle[]" value="Boat">我会python<br>
  <input type="submit" value="提交">
</form>
Copy after login

The effect of the above code is as shown in the figure:

How to get the value of the input tag in HTML? Detailed explanation on the usage of input value

Okay , now this article is over, if you have any questions please leave a message below

[Editor’s recommendation]

in HTML How to write relative path in base tag? (Introduction to use included)

What is the usage of the src attribute of the HTML img tag? Analysis of specific usage methods (examples attached)

The above is the detailed content of How to get the value of the input tag in HTML? Detailed explanation on the usage of input value. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template