1. Tag Control Attribut
In HTML5 können Sie ein Formularelement innerhalb des Tags platzieren und das Steuerelement des Tags übergeben Attribut, um auf das Formularelement zuzugreifen.
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 </head> 7 <body> 8 <script type="text/javascript"> 9 function setValue(){10 var label=document.getElementById("label");11 var textbox=label.control;12 textbox.value=510006;13 }14 </script>15 <form>16 <label id="label">17 邮编:18 <input id="txt_zip" maxlength="6">19 <small>请输入六位数字</small>20 </label>21 <input type="button" value="设置默认值" onclick="setValue()">22 </form>23 </body>24 </html>
TextfeldPlatzhalterattribut
Platzhalter bedeutet, dass, wenn sich das Textfeld im befindet uninput stateStatus . Wenn sich das Textfeld in einem nicht eingegebenen Zustand befindet und den Cursor-Fokus nicht erhält, ist der Eingabeaufforderungstext unscharf.
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Placehoder属性</title> 6 </head> 7 <body> 8 <input type="text" placeholder="请输入用户名"> 9 </body>10 </html>
ListeAttribut
In HTML5 wurde ein einzeiliges Textfeld hinzugefügt Ein Listenattribut, dessen Wert die ID eines Datenlistenelements ist. Das datalist-Element ist ebenfalls ein neu hinzugefügtes-Element in HTML5. Dieses Element ähnelt einem Auswahlfeld, aber wenn der Wert, den der Benutzer festlegen möchte, nicht in der Auswahlliste enthalten ist, kann der Benutzer ihn selbst eingeben. Das Datenlistenelement selbst wird nicht angezeigt, sondern als Eingabeaufforderung angezeigt, wenn das Textfeld den Fokus erhält.
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>List属性</title> 6 </head> 7 <body> 8 <form> 9 <input type="text" name="zkdir" list="zkdir">10 <datalist id="zkdir" style="display: none;">11 <option value="HTML5学习">HTML5学习</option>12 <option value="CSS3学习">CSS3学习</option>13 <option value="JavaScript学习">JavaScript学习</option>14 </datalist>15 </form>16 </body>17 </html>
Textfeld-AutoComplete-Eigenschaft
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>文本框AutoComplete属性</title> 6 </head> 7 <body> 8 <form> 9 <input type="text" name="zkdir" autocomplete="on" list="zkdir"> <!--autocomplete有两个值:on&off,不填写取决于当前浏览器的默认值-->10 <datalist id="zkdir" style="display: none;">11 <option value="HTML5学习">HTML5学习</option>12 <option value="CSS3学习">CSS3学习</option>13 <option value="JavaScript学习">JavaScript学习</option>14 </datalist>15 </form>16 </body>17 </html>
Das Musterattribut des Textfelds
Das Attribut „Auswahl“
RichtungDas unbestimmte Attribut des KontrollkästchensHöheund das Attribut Breite der Schaltfläche „Senden“
Das obige ist der detaillierte Inhalt vonNeue Elemente und Attribute für HTML5-Formulare. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!