Quantcast
Channel: Kursus Website Terbaik
Viewing all articles
Browse latest Browse all 2170

Fungsi Atribut Placeholder Dalam Form Element di HTML5

$
0
0

Halo teman-teman bertemu lagi dalam artikel saya, kali ini kita akan belajar mengenal fungsi atribut placeholder dalam form element di HTML5, di dalam form element ada beberapa macam atribut yang sering di pakai, salah satunya yaitu placeholder, disini kita akan membahas fungsi atribut ini, bagaimana cara penggunaanya bagaimana efeknya ketika menggunakan atribut placeholder ini dan bagaimana jika tidak menggunakannya, oke kalau begitu simak terus ya teman-teman.

Mengenal fungsi atribut placeholder dalam form element di HTML5, sebenarnya sudah sering kita jumpai ketika kita ingin membuat form element, dan jika teman-teman belum mengenal form element, saya akan bahas sedikit, form element seperti yang saya bahas dalam artikel sebelumnya,  itu berupa inputan seperti input type text, password dan lain-lain, pasti teman-teman langsung ingat ya.

Atribut placeholder digunakan untuk membuat teks sementara (placeholder) di dalam objek form. Teks ini akan hilang saat pengguna mulai mengetik sesuatu, sehingga cocok digunakan untuk memberi contoh cara pengisian form. jadi ketika user atau pengunjung kebingungan untuk mengisi form, kita akan bantu menggunakan atribut placeholder ini, pastinya teman-teman sudah pernah melihat ada teks dengan warna ke abu-abuan muda di form, ketika kita klik teks itu hilang, dan itu bisa muncul karena bantuan dari atribut yang di namakan placeholder.

Oke langsung saja kita masuk dalam contoh penggunaanya:

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>fungsi atribut placeholder dalam form element di HTML5</title>
</head>
<body>
	<form action="prosesform.php" method="get">
		<p>Nama : <input type="text" name="nama_user" placeholder="Sobiatun sarmu'ah">
		</p>
		<p>Email : <input type="email" name="email_user" placeholder="sobiatun_imut@example.com">
		</p>
		<p>Alamat :	<textarea name="alamat" placeholder="alamat rumah lengkap sobiatun..."></textarea>
		</p>
		<p><input type="submit" value="Kirim Data"></p>
       </form>
</body>
</html>

Bisa teman-teman lihat ya, saya menggunakan beberapa atribut placeholder dalam inputan type text, type email, dan textarea. oke bagaimana hasilnya, pasti teman-teman juga sudah penasaran kan, dan ini hasilnya:

fungsi atribut placeholder dalam form element di HTML5

Bagaimana teman-teman jika teman-teman melihat contoh pengisian form di atas pasti merasa tidak kebingungan bukan untuk mengisinya dan atribut placeholder berbeda dengan atribut value, nilai dari placeholder tidak akan dikirim untuk diproses. Jika pengguna tidak mengubah isian objek from, maka form dianggap dalam keadaan kosong. Sebelum ada atribut ini, kita harus menggunakan JavaScript untuk mendapatkan efek yang sama.

Oke teman-teman saya rasa cukup sampai disini dulu kita belajar mengenal fungsi atribut placeholder dalam form element di HTML5, semoga bermanfaat dan sampai jumpa di artikel saya selanjutnya, terimakasih.

The post Fungsi Atribut Placeholder Dalam Form Element di HTML5 appeared first on Kursus Website Terbaik.


Viewing all articles
Browse latest Browse all 2170

Trending Articles