Kann mir jemand sagen, wie ich ein HTML-Formular abschicken kann, wenn die Return-Taste gedrückt wird und keine Schaltflächen im Formular vorhanden sind? Die Schaltfläche "Senden" ist nicht vorhanden . Ich verwende stattdessen ein benutzerdefiniertes Div.
Antworten
Zu viele Anzeigen?
palotasb
Punkte
3611
Ich denke, Sie sollten eigentlich einen Submit-Button oder ein Submit-Bild haben... Haben Sie einen bestimmten Grund für die Verwendung eines "submit div"? Wenn Sie nur benutzerdefinierte Stile wollen, empfehle ich <input type="image"... . http://webdesign.about.com/cs/forms/a/aaformsubmit_2.htm
f_i
Punkte
2634
Um die Antworten zu erweitern: Bei mir hat es folgendermaßen funktioniert, vielleicht ist es für andere nützlich.
Html
<form method="post" action="/url" id="editMeta">
<textarea class="form-control" onkeypress="submitOnEnter(event)"></textarea>
</form>Js
function submitOnEnter(e) {
if (e.which == 13) {
document.getElementById("editMeta").submit()
}
}
denn
Punkte
330
Ähnlich wie das Beispiel von Chris Marasti-Georg, nur mit Inline-Javascript. Im Wesentlichen fügen Sie onkeypress zu den Feldern, die Sie wollen, dass die Eingabetaste zu arbeiten mit. Dieses Beispiel wirkt auf das Passwortfeld.
<html>
<head><title>title</title></head>
<body>
<form action="" method="get">
Name: <input type="text" name="name"/><br/>
Pwd: <input type="password" name="password" onkeypress="if(event.keyCode==13) {javascript:form.submit();}" /><br/>
<input type="submit" onClick="javascript:form.submit();"/>
</form>
</body>
</html>
AndrewH
Punkte
3308
Desde display: none Schaltflächen und Eingaben in Safari und IE nicht funktionieren, habe ich herausgefunden, dass der einfachste Weg, bei dem keine zusätzlichen Javascript-Hacks ist es, einfach ein absolut positioniertes <button /> auf das Formular und platzieren Sie es weit weg vom Bildschirm.
<form action="" method="get">
<input type="text" name="name" />
<input type="password" name="password" />
<div class="yourCustomDiv"/>
<button style="position:absolute;left:-10000px;right:9990px"/>
</form>Dies funktioniert in der aktuellen Version aller wichtigen Browser (Stand: September 2016).
Offensichtlich ist es empfehlenswert (und semantisch korrekter), nur den Stil <button/> wie gewünscht.
realtimeguy
Punkte
1
Mit dem Attribut "Autofokus" wird der Schaltfläche standardmäßig der Eingabefokus zugewiesen. Wenn Sie auf ein beliebiges Steuerelement innerhalb des Formulars klicken, wird auch der Fokus auf das Formular gelegt, was eine Voraussetzung dafür ist, dass das Formular auf die RETURN-Taste reagiert. Das Attribut "autofocus" übernimmt diese Aufgabe für Sie, falls der Benutzer nie auf ein anderes Steuerelement innerhalb des Formulars geklickt hat.
Der "Autofokus" macht also den entscheidenden Unterschied, wenn der Benutzer nie auf eines der Steuerelemente des Formulars geklickt hat, bevor er RETURN drückt.
Aber selbst dann müssen noch 2 Bedingungen erfüllt sein, damit dies ohne JS funktioniert:
a) Sie müssen eine Seite angeben, zu der Sie wechseln möchten (wenn sie leer bleibt, funktioniert es nicht). In meinem Beispiel ist es hello.php
b) Das Steuerelement muss sichtbar sein. Man könnte es zwar von der Seite wegschieben, um es auszublenden, aber man kann nicht display:none oder visibility:hidden verwenden. Was ich tat, war die Verwendung von Inline-Stil, um es einfach von der Seite nach links um 200px zu bewegen. Ich habe die Höhe auf 0px gesetzt, damit es keinen Platz wegnimmt. Denn sonst kann es noch andere Steuerelemente oben und unten stören. Oder man könnte das Element auch schweben lassen.
<form action="hello.php" method="get">
Name: <input type="text" name="name"/><br/>
Pwd: <input type="password" name="password"/><br/>
<div class="yourCustomDiv"/>
<input autofocus type="submit" style="position:relative; left:-200px; height:0px;" />
</form>- See previous answers
- Weitere Antworten anzeigen
