Database Akademi
»
Programlama
»
HTML5 / CSS
»
Html5 Yeni Form Özellikleri - Email ve Url Giriş Türleri
Sıralama: Advanced Member
Gruplar: Registered
Katılan: 27.08.2015(UTC) Mesajlar: 37   5 Mesajına Toplam 5 Kere Teşekkür Edildi.
|
[b]Html5 Email ve Url Giriş Türleri: [/b]
Email ve url giriş türleri özellikle geçerli mail ve web adresleri için yapılmış yeni giriş türleridir.
Email adresi özel bir yazım şekli gerektirir. Geçerli bir email adresi bir domain ismi @ işareti ve bir nokta (.)
içerir .Örn: xyz@abc.com gibi. Doğru yazılmaz ise kullanıcıya bir uyarı gösteren email türü html5 de <input type=”email” /> şeklinde yazılır.
Bir çok url formatı http://www.abc.com şeklindedir. http yada https protokolları uyarınca url belli bir standart formatta olmalıdır. Doğru yazılmaz ise kullanıcıya bir uyarı gösteren url türü html5 de <input type=”url” /> şeklinde yazılır.
Bir örnek yapalım:
<!DOCTYPE html>
<html>
<head>
<title>Html5 Form Kontrolleri </title>
</head>
<body>
<h1> Html5 Form Kontrolleri </h1>
<form>
<label for="loginname"><em>Kullanıcı Adı<em> : </label>
<input name="loginname" type="text" required>
<label for="mail"><em>E-posta<em> : </label>
<input name="mail" type="email" required>
<label for="webpage"><em>Web Siteniz<em> : </label>
<input name="webpage" type="url" required>
<input type="submit" value="Gönder">
</form>
</body>
</html>
Eğer kodu çalıştırıp geçerli bir formatta email girmeden gönder butonuna basarsak bir uyarı ile karşılaşırız. Tarayıcıya göre farklılık gösterse de bu uyarı aşağıdaki gibidir.
[img=http://dbakademi.com/images/forums/html5/email-url.jpg]Html5 geçerli email kontrolü[/img]
Eğer kodu çalıştırıp geçerli bir formatta url girmeden gönder butonuna basarsak bir uyarı ile karşılaşırız. Tarayıcıya göre farklılık gösterse de bu uyarı aşağıdaki gibidir.
[img=http://dbakademi.com/images/forums/html5/email-url2.jpg]Html5 geçerli url kontrolü[/img]
Böylece JavaScript veya regex kontrollerine gerek kalmadan bu kontrolleri sağlarız.
Örnek çalışmaya [b][url=http://www.dbakademi.com/html5-samples/email-url.html]buradan[/url][/b] ulaşabilirsiniz. Düzenle Kullanıcı Tarafından 11 Eylül 2015 Cuma 17:52:39(UTC)
| Sebep: Sebep Bildirilmesi
|
|
|
|
|
|
Database Akademi
»
Programlama
»
HTML5 / CSS
»
Html5 Yeni Form Özellikleri - Email ve Url Giriş Türleri
Forumu Atla
Bu foruma yeni konular postalayamazsınız.
Bu forumda ki konulara yeni posta gönderemezsiniz.
Bu forumdaki postalarınızı silemezsiniz.
Bu forumdaki postalarınızı düzenleyemezsiniz.
Bu forumda anketler yaratamazsınız.
Bu forumdaki anketlere oy veremezsiniz.
