Der Unterschied und die Vorsichtsmaßnahmen zwischen Schaltfläche und Eingabetyp=button_HTML/Xhtml_Webseitenproduktion

-Tag
Definition und Verwendung Das
-Tag definiert eine Schaltfläche.
Innerhalb des Schaltflächenelements können Sie Inhalte wie Text oder Bilder platzieren. Dies ist der Unterschied zwischen diesem Element und der Schaltfläche, die mit dem Eingabeelement erstellt wurde.
Die -Steuerung bietet leistungsfähigere Funktionen und umfangreichere Inhalte als die . Alles zwischen den Tags ist der Inhalt der Schaltfläche, einschließlich aller akzeptablen Textinhalte wie Text oder Multimediainhalte. Beispielsweise können wir ein Bild und zugehörigen Text in eine Schaltfläche einfügen und diese verwenden, um ein attraktives Markup-Bild in der Schaltfläche zu erstellen.
Das einzige verbotene Element ist die Bildzuordnung, da ihre maus- und tastaturempfindlichen Aktionen das Verhalten der Formularschaltflächen beeinträchtigen.
Geben Sie immer das Typattribut für Schaltflächen an. Der Standardtyp im Internet Explorer ist „Schaltfläche“, während der Standardtyp in anderen Browsern (einschließlich der W3C-Spezifikation) „Senden“ ist.
Browser-Unterstützung
Alle gängigen Browser unterstützen das
Wichtig : Wenn Sie das Schaltflächenelement in einem HTML-Formular verwenden, übermitteln verschiedene Browser unterschiedliche Werte. Internet Explorer übermittelt den Text zwischen und , während andere Browser den Inhalt des Wertattributs übermitteln. Bitte verwenden Sie Eingabeelemente in HTML-Formularen, um Schaltflächen zu erstellen.
Hinweise
Bei Verwendung des -Tags ist es leicht, es als selbstverständlich zu betrachten und es als zu verwenden, was leicht dazu führen kann Folgende falsche Verwendungen:
1. Ermitteln Sie den Wert der Schaltflächevalue über $('#customBtn').val()
So funktioniert es unter IE (IE-Kernel). Der Wert wird erhalten, wenn Die Verwendung ist „Schaltfläche“, nicht „Test“. Der unter Nicht-IE erhaltene Wert ist „Test“. Beachten Sie den ersten rot markierten Satz oben.
Dies sollte von unterschieden werden.
Durch diese beiden Methoden erhält $('#customBtn').val(), $('#customBtn').attr('value') den Wert in verschiedenen Browsern wie folgt:

Browser/Value	$('#customBtn').val()	$('#customBtn').attr('value')
Firefox13.0	test	test
Chrome15.0	test	test
Opera11.61	test	test
Safari5.1.4	test	test
IE9.0	按钮	按钮

Überprüfen Sie dies, indem Sie den folgenden Code testen

Kopieren Sie den Code

Der Code lautet wie folgt:

;scripttype="text/javascript"src="jquery-1.4.4.min.js"> {
$('#test1').click(function(){
alert($('#customBtn').attr('value'));
}); '# test2').click(function(){
alert($('#customBtn').val());
});

按钮 inputtype= "button"id="test1"value="getattr"/>
🎜>


2. Fügen Sie versehentlich das Tag

ein. inputtype= "submit"/> Sehen Sie sich den zweiten rot markierten Satz oben an, um zu verstehen, was er bedeutet.
Behandeln Sie das -Tag nicht als Eingabeelement in .
Überprüfen Sie dies, indem Sie den folgenden Code testen





Kopieren Sie den Code

Der Code lautet wie folgt:

🎜>