Der Unterschied zwischen Schaltfläche und Eingabe in einem Formular

Dieses Mal werde ich Ihnen den Unterschied zwischen Schaltfläche und Eingabe im Formular vorstellen. Was sind die Vorsichtsmaßnahmen bei der Verwendung von Schaltfläche und Eingabe im Formular?

Lassen Sie uns zunächst über die Definitionen von Schaltfläche und Eingabe sprechen:

Die Bezeichnung definiert eine Schaltfläche

1: Innerhalb des -Elements können Sie beliebige Inhalte wie Text oder Bilder platzieren. Dies ist der Unterschied zwischen diesem Element und der Schaltfläche, die mit dem

erstellt wurde. Das

-Steuerelement bietet leistungsfähigere Funktionen und umfangreichere Inhalte Der Inhalt zwischen den Tags und ist der Inhalt der Schaltfläche, einschließlich aller akzeptablen Textinhalte wie Text oder

Multimedia

.

-Tag gibt ein Eingabefeld an, in das Benutzer Daten eingeben können

Das -Element wird zum Deklarieren verwendet ein Eingabesteuerelement, das es Benutzern ermöglicht, Daten einzugeben; der spezifische Eingabetyp hängt vom Typattribut ab

Im Folgenden werden die vier Schaltflächen im Detail beschrieben:

, < ;input type= "button"/>, ,

1. : Wenn der Benutzer auf diese Schaltfläche klickt, sendet das Formular den Formularinhalt entsprechend der Aktionsattributeinstellung des

Wenn Sie darauf klicken, wird die Seite aktualisiert.

Wenn Sie die Formulardaten vor dem Absenden der Daten überprüfen möchten:

<form action="#">
    <input type="text" name="username"/><br/>
    <input type="password" name="password"/><br/>
    <input type="submit" value="登录"/></form>

Wenn Sie in der Prüffunktion „false“ zurückgeben, wird das Standardverhalten von verhindert Submit. Das heißt, die Übermittlung von Formulardaten wird verhindert (Seitenaktualisierung wird verhindert). 🎜>

Die

-Rückgabe kann nicht weggelassen werden

2. Gewöhnliche Tasten müssen mit gepaart werden JS nützlich sein, wie zum Beispiel onclickEvents etc.

3 🎜> Gewöhnliche Schaltflächen werden genauso verwendet wie

<form action="#" onsubmit="return check()">
    用户名：<input type="text" name="username"/><br/>
    密码：<input type="password" name="password"/><br/>
    <input type="submit" value="登录"/>
    <input type="button" value="提醒" onclick="remind()"/></form><script  LANGUAGE="JavaScript">function check(){
    console.log("提交前先验证");    var checkElement=document.getElementsByTagName("input");     if(checkElement[0].value==="" || checkElement[1].value==="") {         return false;//当用户名或者密码为空时返回false，此时表单不会提交     }
}function remind(){
    alert("这是一个简单按钮，默认不会提交表单数据,不会刷新页面");
}</script>

Hinweis:

<button type="submit"></button>表单数据提交按钮，与<input type="submit"/> 用法相同

Wenn Formular, sein Browser Der Standardtyp ist button; Wenn ein ;-Element.

<form action="#" onsubmit="return check()">
    用户名：<input type="text" name="username"/><br/>
    密码：<input type="password" name="password"/><br/>
    <button type="submit">登录</button>
    <button type="button"onclick="remind()">提醒</button></form><script  LANGUAGE="JavaScript">function check(){
    console.log("提交前先验证");    var checkElement=document.getElementsByTagName("input");     if(checkElement[0].value==="" || checkElement[1].value==="") {         return false;//当用户名或者密码为空时返回false，此时表单不会提交     }
}function remind(){
    alert("这是一个简单按钮，默认不会提交表单数据,不会刷新页面");
}</script>

Daher wird empfohlen, den Typwert immer für die Schaltfläche festzulegen.

Zusammenfassend:

, verwendet als Schaltfläche zum Senden von Formulardaten, die Seite wird standardmäßig aktualisiert

und

Sie sind beide normale Schaltflächen und werden nicht verwendet Aktualisieren Sie die Seite standardmäßig.

• Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

  Empfohlene Lektüre:

• Was sind die Schritte für Jest, um native Komponenten zu testen?

  Detaillierte Erläuterung impliziter Aufrufe von Javascript
  

  JS fügt neue Elementelemente hinzu
  

Das obige ist der detaillierte Inhalt vonDer Unterschied zwischen Schaltfläche und Eingabe in einem Formular. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!