Ich habe eine Benutzerkonfigurationsseite mit vielen Eingaben eines Formulars. Ich möchte die Eingabe in Echtzeit validieren, um Formatfehler zu vermeiden, wenn der Benutzer die Texteingabe eingibt, den Dateinamen überprüft und einige Informationen eingibt, wenn der Benutzer die Auswahl, Radio, Checkbox eingibt. Ich möchte nur mit der Methode shuold wissen, die ich für jeden Typ der oben genannten Eingabe verwenden.Wie Client Seite Echtzeit Validierung eines Formulars mit Select, Radio, Checkbox, Text, Dateieingabe, einfach Javascript verwenden?
Antwort
Sie müssen eine Logik schreiben, die die Validierung für Sie durchführt. Sobald Sie es geschrieben haben, können Sie keyup
Ereignis von jquery verwenden, das diese Funktion aufrufen wird, sobald Sie etwas eingeben.
Zum Beispiel wird das folgende Schnipsel in Echtzeit Validierungen durchführen, sobald Sie mit der Eingabe beginnen. Wenn der eingegebene Text nur aus Alphabeten besteht, gibt es keinen Fehler (und falls vorhanden, wird er verschwinden) und sobald Sie eine Zahl eingegeben haben, wird ein Fehler angezeigt.
$("#only-text").on("keyup", function() {
realTimeValidate();
});
function realTimeValidate() {
var inputField = document.getElementById("only-text").value;
if(!isAlphaOrParen(inputField))
document.getElementById("showerror").innerHTML = "Please enter only numbers";
else
document.getElementById("showerror").innerHTML = "";
}
function isAlphaOrParen(str) {
return /^[a-zA-Z()]+$/.test(str);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Type only Text (error will be generated if you type a number) : <br><input id="only-text" type="text"/><br>
<span id="showerror" style="color:red"></span>
Ja, es scheint gut, ich werde es versuchen. Wie wäre es mit anderen Eingabetypen? –
für 'type =" radio ",' type = "select" 'und' type = "checkbox" ', können Sie javascript' onchange = "yourFunction()" 'verwenden. Es gibt viele Möglichkeiten, wie Sie dies tun können Dinge. Nur Google '" Eingabe onchange Echtzeit-Ereignis "' –
mit diesen Eingabe-Typ Sie oben genannten, kann ich onclick verwenden, um von onchange zu ersetzen –
- 1. Javascript Client-Seite Validierung
- 2. ASP.NET C# Checkbox Echtzeit-Validierung
- 3. Validierung meines Formulars
- 4. Javascript mehrere Checkbox Validierung
- 5. Php ereg Validierung eines Formulars
- 6. CMS einfach gemacht - Hinzufügen eines PHP-Formulars
- 7. ModalPopUpExtender mit Checkbox Validierung
- 8. Validierung des Formulars funktioniert nicht
- 9. fließende Validierung mit auf Client-Seite
- 10. jQuery Validation Checkbox und Radio nicht validieren
- 11. Client-Seite Validierung funktioniert nicht asp.net mvc5
- 12. Checkbox Validierung
- 13. Validierung meines Formulars
- 14. Erstellen und Einreichen eines Formulars mit Javascript
- 15. Ausfüllen eines Formulars clientseitig [Javascript]
- 16. Übernehmen Validierung für Formularfelder Client-Seite mit Winkel
- 17. Twitter Bootstrap Radio/Checkbox - wie man glyphicon
- 18. Styling Dateieingabe mit Foundation
- 19. Ipad und Iphone: Javascript Bildeingabetasten (Radio, Checkbox) funktioniert nicht gut
- 20. Validieren eines Formulars mit MVC3?
- 21. JQuery Validierung Plugin mit Ankreuzfeldgruppe
- 22. JavaScript Validierung
- 23. Select vs Radio-Buttons und Checkboxen
- 24. Generieren eines neuen Formulars mit Javascript mit onclick der Schaltfläche
- 25. MVC Client-Seite E-Mail-Validierung
- 26. Google reCaptcha Validierung nicht auf Client-Seite
- 27. Bedingte Einstellung einer JavaScript-Funktion nach der Veröffentlichung eines Formulars
- 28. ASP.Net MVC: Bit verschiedene Art von bedingten Validierung Server Seite und Client-Seite
- 29. Zweig: Entfernen div um jede Checkbox Felder eines Formulars
- 30. Brechen eines Formulars zwischen mehreren Tabs in Winkelbrüche Validierung
Geben Sie für 'onchange' Ereignisse an jedem der Eingänge, wählt usw. schreiben JS-Funktion für jeden der Eingänge zu validieren. –
kann ich onclick mit der anklickbaren Eingabe verwenden? –
Ja, aber ich sehe keinen Sinn darin. Versuchen Sie zum Beispiel hier zu suchen - http://www.the-art-of-web.com/javascript/validate/ - es kann Ihnen den Punkt geben, wie Sie Formulare validieren. –