HTML5-Formulare mit jQuery.html5form
Mit dem von Matias Mancini machen Sie aus Ihrem Browser einen HTML5-Kompatiblen Bowser. Mit Einschränkungen aber ...
2010-09-23 10:12:45 2010-09-23 10:12:45 admin
Mit HTML5 lassen sich schöne, aber vor allem praktikable Formulare bauen. Leider nur, dass viele Browser mit HTML5 noch nicht umgehen können.
![](/de/cache/users/A/1/uploads/jqueryform.jpeg)
Matias Mancini hat sich mit seinem jQuery-Plugin aufgemacht, diesen Missstand ein wenig zu mindern. Mit nur einer Zeile Code im Header stehen Ihnen jetzt Platzhaltern, Maxlength, Autocomplete und den Input-Feldern Url und E-Mail zur Verfügung. Leider werden die Input-Felder Date und Number noch nicht unterstützt.
Aktuell werden folgende Browser unterstützt.- Internet Explorer: IE6 - IE7 - IE8 - IE9 beta
- Mozilla Firefox: 3.0 - 3.5 - 3.6 - 4.0 beta4
- Google Chrome: 4.0 - 5.0 - 6.0
- Apple Safari: 4.0 - 5.0
so einfach gehts
Im ersten Schritt werden die notwendigen jQuery und jQuery.html5form im header eingebunden
<head> //jQuery library <script src='http://code.jquery.com/jquery-1.4.2.min.js'></script> //jQuery.html5form plugin <script src='http://html5form.googlecode.com/svn/trunk/jquery.html5form-min.js'> </script> <script> $(document).ready(function(){ $('#myform').html5form(); }); </script> </head>
Dann einfach nur ein HTML5 Formular aufbauen und fertig. Es werden keine Classen benötigt. Die notwendigen Informationen erhält jQuery.html5form über die Attribute.
<input type='email' name='email' id='email'/>
Den Rest übernimmt jetzt jQuery.html5form. In diesem Beispiel wird auf Korrektheit der Emailadresse automatisch geprüft.
Auf die selbe einfache Art und Weise können Required -Elemente erstellt werden.
<input type='text' name='lastname' required />
Unter http://www.matiasmancini.com.ar/html5form_en.php findet Ihr weitere Beispiele
Ratings
Here you can write a comment
Related topics
Verschlüsselungsalgorithmus
Dieses Tutorial zeigt einen Verschlüsselungsalgorithmus von Texten nach dem PHP Data Encryption Standard. ...
![Lukas Beck](/en/cache/img/7db53479b4d8289aa1fe24926b4bb0985050c.webp)
Autor :
Lukas Beck
Category:
PHP-Tutorials
Gewichtete SQL-Abfragen
Gewichtete Abfragen werde häufig im Banner-Umfeld benötigt. Also überall da, wo Banner nach bestimmten Kriterien einblendet werden sollen. Wenn man davon ausgeht, das Banner unterschiedlichen Klick-Erfolg haben, dann liegt der Gedanke nahe, genau diese Ba ...
![admin](/en/cache/img/11d1a7c0dcebb73717cd882a819e96935050c.webp)
Autor :
admin
Category:
mySQL-Tutorials
Wie erstelle ich ein LogIn-Skript?
Das folgende Tutorial nutzt eine Datenbank, in der die Benutzerdaten gespeichert werden und eine Session, in der der Benutzer registriert wird. ...
![andy@](/en/cache/img/7db53479b4d8289aa1fe24926b4bb0985050c.webp)
Autor :
andy@
Category:
PHP-Tutorials
Gästebuch mit Datenbankanbindung
Dieses Tutorial beschreibt ausführlich wie ein Gästebuch in PHP und mySQL programmiert wird. ...
![andy@](/en/cache/img/7db53479b4d8289aa1fe24926b4bb0985050c.webp)
Autor :
andy@
Category:
PHP-Tutorials
Anzeige des letzten Besuchers auf der Website
PHP und MySQL ermöglichen es, mit wenig Aufwand Datum und Uhrzeit des letzten Besuchers auf der Homepage anzeigen zu lassen. ...
![Lukas Beck](/en/cache/img/7db53479b4d8289aa1fe24926b4bb0985050c.webp)
Autor :
Lukas Beck
Category:
PHP-Tutorials
What do I need to set in WordPress to Stop loading Google Fonts?
Want to stop WordPress from using Google Fonts? Here you can learn what you need to set in WordPress. ...
![admin](/en/cache/img/11d1a7c0dcebb73717cd882a819e96935050c.webp)
Autor :
admin
Category:
Other tutorials