Input Type Url, Kontrol Form HTML5 - Purwana.Net
  Media Belajar membuat Software Aplikasi, Website, & Game untuk Pemula...

Post Top Ad

Rabu, 13 Desember 2017

Input Type Url, Kontrol Form HTML5

Berikut sekilas tentang uji penulisan input bertipe Url,  HTML5

<style scoped>
input:invalid, textarea:invalid { color: red; }
</style>


<label for="fURL">URL</label>
<input type="url" id="fURL">

Hasilnya akan tampak seperti berikut :

Jenis masukan url adalah untuk URL absolut, yang, tapi definisi, selalu menyertakan sebuah protokol.

Safari, Chrome, Opera, Android dan Firefox semua hanya memerlukan satu huruf plus titik dua: a: valid. IE membutuhkan setidaknya 2 huruf sebelum titik dua. Tidak ada browser yang memerlukan protokol umum seperti http, https atau ftp, atau bahkan //.

Mobile Safari tidak melakukan validasi, namun menampilkan keyboard yang dilengkapi kunci [/] dan [.com], dan menghapus kunci spasi. Android, hingga setidaknya 4.3, tidak memberi pengguna keyboard khusus URL.

Jika invalid, Firefox, Chrome, dan IE memberikan pesan kesalahan. Opera memberikan fokus elemen tanpa verbiage. Safari (Saat ini 7) tidak memberikan batasan validasi pada form submission.

Cross verbiage browser:
Firefox: Silahkan masukkan URL.
Chrome: Harap masukkan URL
IE: Anda harus memasukkan URL yang valid

Untuk memastikan protokol tertentu, gunakan atribut pattern

Agar tidak memerlukan protokol, kita akan bisa menggunakan jenis input teks dengan atribut inputmodel setidaknya untuk mendapatkan keypad terbaik dalam mendukung browser.

Post Top Ad