HTML Input 属性

value 属性

value 属性规定输入字段的初始值:

Shafi

First name:
<input type="text" name="firstname" value="Bill">
Last name:
</form>

Dukkanci

readonly 属性

readonly 属性规定输入字段为只读(不能修改):

Shafi


 First name:
<input type="text" name="firstname" value="Bill" readonly>
Last name:
</form>

Dukkanci

readonly 属性不需要值。它等同于 readonly="readonly"。

disabled 属性

disabled 属性规定输入字段是禁用的。

被禁用的元素是不可用和不可点击的。

被禁用的元素不会被提交。

Shafi


 First name:
<input type="text" name="firstname" value="Bill" disabled>
Last name:
</form>

Dukkanci

disabled 属性不需要值。它等同于 disabled="disabled"。

size 属性

size 属性规定输入字段的尺寸(以字符计):

Shafi


 First name:
<input type="text" name="firstname" value="Bill" size="40">
Last name:
</form>

Dukkanci

maxlength 属性

maxlength 属性规定输入字段允许的最大长度:

Shafi


 First name:

Last name:
</form>

Dukkanci

如设置 maxlength 属性,则输入控件不会接受超过所允许数的字符。

该属性不会提供任何反馈。如果需要提醒用户,则必须编写 JavaScript 代码。

Gwagwarmaya:输入限制并非万无一失。JavaScript 提供了很多方法来增加非法输入。如需安全地限制输入,则接受者(服务器)必须同时对限制进行检查。

HTML5 属性

HTML5 为 增加了如下属性:

  • autocomplete
  • autofocus
  • form
  • formaction
  • formenctype
  • formmethod
  • formnovalidate
  • formtarget
  • height 和 width
  • list
  • min 和 max
  • multiple
  • pattern (regexp)
  • placeholder
  • required
  • step

并为 增加如需属性:

  • autocomplete
  • novalidate

autocomplete 属性

autocomplete 属性规定表单或输入字段是否应该自动完成。

当自动完成开启,浏览器会基于用户之前的输入值自动填写值。

Tafiyar:A iya saurayi wa iyalan furawsar autocomplete zai iya, kuma abin da yana da off zai iya kuma kuma.

属性 autocomplete tana da wajibci ga <form> kuma ga <input> na wannan nau'in: text, search, url, tel, email, password, datepickers, range kuma color.

Shafi

Furawsar da iyalan HTML da a fiwa (kuma kuma kuma abin da yana da off):

<form action="action_page.php" autocomplete="on">
   Sunan: <input type="text" name="fname"><br>
   Sunan maza: <input type="text" name="lname"><br>
   Iyali: <input type="email" name="email" autocomplete="off"><br>
   <input type="submit">
</form> 

Dukkanci

Tafiyar:在某些浏览器中,您也许需要手动启用自动完成功能。

novalidate 属性

novalidate 属性属于 <form> 属性。

如果设置,则 novalidate 规定在提交表单时不对表单数据进行验证。

Shafi

指示表单在被提交时不进行验证:

<form action="action_page.php" novalidate>
   E-mail: <input type="email" name="user_email">
   <input type="submit">
</form> 

Dukkanci

autofocus 属性

autofocus 属性是布尔属性。

如果设置,则规定当页面加载时 <input> 元素应该自动获得焦点。

Shafi

使 "First name" 输入字段在页面加载时自动获得焦点:

First name:<input type="text" name="fname" autofocus>

Dukkanci

form 属性

form 属性规定 <input> 元素所属的一个或多个表单。

Tafiyar:如需引用一个以上的表单,请使用空格分隔的表单 id 列表。

Shafi

输入字段位于 HTML 表单之外(但仍属表单):

<form action="action_page.php" id="form1">
   Sunan farko: <input type="text" name="fname"><br>
   <input type="submit" value="Submit">
</form>
 Last name: <input type="text" name="lname" form="form1">

Dukkanci

formaction 属性

formaction 属性规定当提交表单时处理该输入控件的文件的 URL。

formaction 属性覆盖 <form> 元素的 action 属性。

formaction 属性适用于 type="submit" 以及 type="image"。

Shafi

拥有两个两个提交按钮并对于不同动作的 HTML 表单:

<form action="action_page.php">
   Sunan farko: <input type="text" name="fname"><br>
   Sunan maza: <input type="text" name="lname"><br>
   <input type="submit" value="Submit"><br>
   <input type="submit" formaction="demo_admin.asp"
   value="Submit as admin">
</form> 

Dukkanci

formenctype 属性

formenctype 属性规定当把表单数据(form-data)提交至服务器时如何对其进行编码(仅针对 method="post" 的表单)。

formenctype 属性覆盖 <form> 元素的 enctype 属性。

formenctype 属性适用于 type="submit" 以及 type="image"。

Shafi

发送默认编码以及编码为 "multipart/form-data"(第二个提交按钮)的表单数据(form-data):

<form action="demo_post_enctype.asp" method="post">
   Sunan farko: <input type="text" name="fname"><br>
   <input type="submit" value="Submit">
   <input type="submit" formenctype="multipart/form-data"
   value="Submit as Multipart/form-data">
</form> 

Dukkanci

formmethod 属性

formmethod 属性定义用以向 action URL 发送表单数据(form-data)的 HTTP 方法。

formmethod 属性覆盖 <form> 元素的 method 属性。

formmethod 属性适用于 type="submit" 以及 type="image"。

Shafi

第二个提交按钮覆盖表单的 HTTP 方法:

<form action="action_page.php" method="get">
   Sunan farko: <input type="text" name="fname"><br>
   Sunan maza: <input type="text" name="lname"><br>
   <input type="submit" value="Submit">
   <input type="submit" formmethod="post" formaction="demo_post.asp"
   value="Submit using POST">
</form> 

Dukkanci

formnovalidate 属性

novalidate 属性是布尔属性。

如果设置,则规定在提交表单时不对 <input> 元素进行验证。

formnovalidate 属性覆盖 <form> 元素的 novalidate 属性。

formnovalidate 属性可用于 type="submit"。

Shafi

拥有两个提交按钮的表单(验证和不验证):

<form action="action_page.php">
   E-mail: <input type="email" name="userid"><br>
   <input type="submit" value="Submit"><br>
   <input type="submit" formnovalidate value="Submit without validation">
</form> 

Dukkanci

Tasunin formtarget

Tasunin formtarget dominan amsan gina, zai nuna koyarwa a kan shi.

Tasunin formtarget zai mayar da tasiri kan tasunin target na <form> gina.

Tasunin formtarget zai iya amfani da shi tare da type="submit" da type="image".

Shafi

Gina zaiya biyu na bututuwa, wadanda ke a kan shafin na gaba:

<form action="action_page.php">
   Sunan farko: <input type="text" name="fname"><br>
   Sunan maza: <input type="text" name="lname"><br>
   <input type="submit" value="Amsa a cikin haukari">
   <input type="submit" formtarget="_blank"
   value="Amsa zuwa shafin na gaba">
</form> 

Dukkanci

Tasunin height da width

Tasunin height da width dominan <input> gina:

Tasunin height da width ne dominan <input type="image">.

Gwagwarmaya:Kwace gina kai tsaye a kai tsaye. Idan masu yin tasiri a kan kai tsaye, shafin zai zama zafi a lokacin yin lafiya.

Shafi

A gina zaiya a <input type="image"> dominan a gina, kuma a mayar da height da width:

<input type="image" src="img_submit.gif" alt="Submit" width="48" height="48">

Dukkanci

Tasunin <datalist>

Tasunin <datalist> dominan na a <input> gina ni gurbin tsohon kiri.

Shafi

A gina ne a <datalist> dominan a <input> gina:

<input list="browsers">
<datalist id="browsers">
   <option value="Internet Explorer">
   <option value="Firefox">
   <option value="Chrome">
   <option value="Opera">
   <option value="Safari">
 

Dukkanci

min 和 max 属性

min 和 max 属性规定 元素的最小值和最大值。

min 和 max 属性适用于如需输入类型:number、range、date、datetime、datetime-local、month、time 以及 week。

Shafi

具有最小和最大值的 元素:

Enter a date before 1980-01-01:

 Enter a date after 2000-01-01:

 Quantity (between 1 and 5):

Dukkanci

multiple 属性

multiple 属性是布尔属性。

If set, it specifies that the user is allowed to enter one or more values in the <input> element.

ɗanɗin multiple na amfani wa ɗanɗin ɗanɗin yan: email da file.

Shafi

Zaɗin fassara ɗanɗin yan fassara ɗanɗin yan fassara ɗanɗin yan fassara ɗanɗin yan

Yan ɗanɗin fassara: <input type="file" name="img" multiple>

Dukkanci

ɗanɗin pattern na

ɗanɗin pattern na fassara ɗanɗin kan ɗanɗin yan <input> ɗanɗin yan fannin farin gida.

ɗanɗin pattern na amfani wa ɗanɗin ɗanɗin yan: text, search, url, tel, email, and password.

Tafiyar:Yin amfani da ɗanɗin title na ɗanɗin gaba ɗanɗin fassara ɗanɗin canza ɗanɗin kan yohun yan.

Tafiyar:Gyara ɗanɗin kan ɗanɗin JavaScript na nuni fannin farin gida ɗanɗin kuma ɗanɗin kai.

Shafi

Zaɗin ɗanɗin ko yanci ɗanɗin na uku (gaba da alama ɗanɗin ko ɗanɗin da yanci ɗanɗin)

Country code: 
<input type="text" name="country_code" pattern="[A-Za-z]{3}" title="Three letter country code">

Dukkanci

placeholder ɗanɗin

placeholder ɗanɗin na yin fassara ɗanɗin yohun yantaa a rafin yan (gabatarwa ɗanɗin ko fassara kan farin gida)

Rarrin zai yohun yan zai yohun rafin yan zai yan

Placeholder attribute yana amfani da saukiya na kwarinca a cikin: text, search, url, tel, email da password.

Shafi

Masuwaru mai kara da kwarinca na da kwarinca na kara da kwarinca:

<input type="text" name="fname" placeholder="First name">

Dukkanci

Required attribute

Required attribute yana da wuri da kuma kwarinca.

Idan ana gudanar da shi, yana rarraba cewa masuwaru na daidai a cikin kwanaki kwarinca kafin a kai gudanar da saukiya.

Required attribute yana amfani da saukiya na kwarinca a cikin: text, search, url, tel, email, password, pickers da number, checkbox, radio da file.

Shafi

Masuwaru mai kara da kwarinca:

Username: <input type="text" name="usrname" required>

Dukkanci

Step属性

Step属性 yana rarraba kwarinca na daidai na <input> element.

Shafi: Idan step="3", kwarinca na daidai a cikin -3, 0, 3, 6, kuma sauran.

Tafiyar:Step属性 yana iya amfani da max da min attributes don kafa na'ura na kwarinca.

Step属性 yana amfani da saukiya na kwarinca a cikin: number, range, date, datetime, datetime-local, month, time da week.

Shafi

Masuwaru mai kara da nau'i nau'i kwarinca:

<input type="number" name="points" step="3">

Dukkanci