In this tutorial input attributes are briefly described. Here will be source codes with examples.
List of input attributes
1) type
The attribute is used for type of input element.
2) value
The value attribute is used for value of input element.
3) placeholder
The placeholder attribute is used for expected value of input element.
4) name
The name attribute is used for the name of the input element.
5) alt
The alt attribute is used for alternate text if image is not shown.
6) autofocus
The autofocus attribute is used for automatically get focus.
7) checked
The checked attribute is used for selecting the given condition.
8) disabled
The disabled attribute is used disable an input field.
9) max
The max attribute is used for specify maximum limit for date in an input field.
10) required
The required attribute is used for an input field which must be filled.
11) readonly
The readonly attribute is used for and input field for readonly which can't modified.
12) align
The align attribute is used for alingment of data in an input field.
13) autocomplete
The autocomplete attribute is used to enabled the autocomplete property for and input field.
14) height
The height attribute is used for the an input field to specify the height.
15) maxlength
The maxlength attribute is used to specify the maximum length of data for an input field.
16) src
The scr attribute is used to specify the url.
17) width
The width attribute is used to specify the width of an input field.
Example of value attribute
Name: <
input
type
="
text
"
value
="
Imran
"
>
Button: <
input
type
="
button
"
value
="
click here
"
>
This input attribute return the value which is set in value attribute initially.
output of above example
Name:
Button:
The readonly and disabled attributes
Name: <
input
type
="
text
"
value
="
Imran
"
readonly
>
Name: <
input
type
="
text
"
value
="
Imran
"
disabled
>
Syntax to make the file disabled.
output of above example
readonly:
disabled:
Explanation readonly and disabled
As in above example two attributes readonly and disabled are give, they can be used in any form. These attributes are used to prevent the user from selection.If you want to changed the disabled form's functionalities then its is only possible by script.While readonly attribute is used to prevent the users from changing the values in the input field in the given form.
The size attribute
fname: <
input
type
="
text
"
size
="
10
"
>
lname: <
input
type
="
text
"
value
="
click here
"
size
="
20
"
>
size attribute used to give a with to input field which will be shown in the browser.
output of above example
fname:
input field with size 10.
lname:
input field with size 20.
The placeholder attribute
fname: <
input
type
="
text
"
placeholder
="
name
"
>
password: <
input
type
="
password
"
placeholder
="
password
"
"
>
placeholder is value which is shown in the input field which is used as a hint for the
user to fill it.
output of above example
fname:
input field with placeholder
password:
input field with password
The required attribute
name: <
input
type
="
text
"
placeholder
="
name
"
required
>
password: <
input
type
="
password
"
placeholder
="
password
"
required
>
required attribute is just like a condition or validation to the form to prevent users from
submitting the form having any one field empty.
output of above example
Comment here
If you have any query, if you want to know something about any of technical course related to computer science field, if you have any suggestion about relevant to uploaded content or if you anything wrong here (any mistake in content) than please contact us. Keep in mind, comment should be according to community guidelines.