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
Erfahrungen
Hier Kannst Du einen Kommentar verfassen
Verwandte Beiträge
PHP cURL-Tutorial: Verwendung von cURL zum Durchführen von HTTP-Anfragen
cURL ist eine leistungsstarke PHP-Erweiterung, die es Ihnen ermöglicht, mit verschiedenen Servern über verschiedene Protokolle wie HTTP, HTTPS, FTP und mehr zu kommunizieren. ...
![TheMax](/de/cache/img/386a92f3efb9792453becfc1914a8f6d5050c.webp)
Autor :
TheMax
Kategorie:
PHP-Tutorials
SVN Server einrichten
Wie man unter Linux einen Subversion Server einrichtet. ...
![admin](/de/cache/img/11d1a7c0dcebb73717cd882a819e96935050c.webp)
Autor :
admin
Kategorie:
Linux & Server Tutorials
phpinfo() zeigt nichts an
Heute möchte ich Euch zeigen wie ihr die phpinfo() ausgeben könnt. ...
![Webmasterfreaky](/de/cache/img/7db53479b4d8289aa1fe24926b4bb0985050c.webp)
Autor :
Webmasterfreaky
Kategorie:
PHP-Tutorials
Counter auf MySQL Basis
Neben der Möglichkeitet, einen Counter per Textfiles zu programmieren, besteht auch die Möglichkeit, MySQL zu verwenden. ...
![Lukas Beck](/de/cache/img/7db53479b4d8289aa1fe24926b4bb0985050c.webp)
Autor :
Lukas Beck
Kategorie:
PHP-Tutorials
Midjourney Tutorial - Anleitung für Anfänger
Über Midjourney, dem Tool zur Erstellung digitaler Bilder mithilfe von künstlicher Intelligenz, gibt es ein informatives Video mit dem Titel "Midjourney Tutorial auf Deutsch - Anleitung für Anfänger" ...
![Mike94](/de/cache/img/a8884842db5283ce067d09927d1ac42e5050c.webp)
Autor :
Mike94
Kategorie:
KI Tutorials
MySQL Klasse
In meinem kleinen Tutorial zeige ich euch, wie ihr ganz einfach eine kleine MySQL Klasse schreiben könnt. ...
![Borlabs](/de/cache/img/cd4eaf1a51bd8234da43e95c93e7f17d5050c.webp)
Autor :
Borlabs
Kategorie:
mySQL-Tutorials