this → Artikel Baru – ( Atrikel Lama ↓ )

7 Contoh Program Penerapan Atribut Disabled pada HTML

Atribut disabled pada HTML mengindikasikan elemen yang disabled atau yang tidak. Jika nilai atribut disabled di-setting, maka elemen tersebut akan disabled. Atribut disabled umumnya digambarkan dengan teks berwarna abu-abu. Jika elemen tersebut tidak disabled, maka tidak akan memberikan respon apapun pada user action yang merupakan atribut boolean.

Kegunaan: Atribut disabled dapat digunakan pada elemen <button><input><option><select><textarea><feildset>, dan <optgroup>.

Sintak:
<tag disabled></tag>

<button>: Jika atribut disabled digunakan pada elemen button, maka akan membuat elemen botton menjadi disabled yang tidak dapat digunakan atau diklik.

Pahami pula, tentang semua konsep desain Web untuk tingkat pemula melalui materi lengkap HTML [klik].


Contoh:

<!DOCTYPE html>

<html>

 

<head>

<title>

HTML atribut disabled

</title>

</head>

 

<body 

style = "text-align:center">

 

<h1 

style = "color: green;">

Blog Elfan

</h1>

 

<h2>

HTML atribut disabled

</h2>

 

<!--tombol disabled-->

<button 

type="button

disabled>

Click Me!

</button>

</body>

 

</html>

Output:

Blog Elfan

HTML atribut disabled



<input>: Jika atribut disabled digunakan pada elemen input, maka akan membuat elemen input menjadi disabled yang tidak dapat digunakan atau diklik.

Baca juga, tentang materi bahasa pemrograman lainnya melalui Materi Lengkap 

Bahasa Pemrograman [klik].


Contoh:

<!DOCTYPE html>

<html>

 

<head>

<title>

HTML atribut disabled

</title>

</head>

 

<body 

style = "text-align:center">

 

<h1 style = "color: green;">

Blog Elfan

</h1>

 

<h2>

HTML atribut disabled

</h2>

 

<!--input disabled-->

<label>

 

Input:

<input 

type="text

name="value

value ="input field disabled

disabled>

 

</label>

 

</body>

 

</html>

Output:

Blog Elfan

HTML atribut disabled



<option>: Jika atribut disabled digunakan pada elemen option, maka akan membuat elemen option menjadi disabled yang tidak dapat digunakan atau diklik.

Contoh:

<!DOCTYPE html>

<html>

 

<head>

<title>

HTML atribut disabled

</title>

</head>

 

<body 

style = "text-align:center">

 

<h1 style = "color: green;">

Blog Elfan

</h1>

 

<h2>

HTML atribut disabled

</h2>

 

<!-- input disabled -->

<p>

Yamaha disabled

</p>

 

<select>

 

<option 

value="yamaha

disabled>

yamaha

</option>

 

<option 

value="honda">

honda

</option>

 

<option 

value="ducati">

ducati

</option>

 

<option 

value="bandai">

bandai

</option>

 

</select>

 

<br>

 

</body>

 

</html>

Output:

Blog Elfan

HTML atribut disabled

Yamaha disabled



<select>: Jika atribut disabled digunakan pada elemen select, maka akan membuat elemen select menjadi disabled yang tidak dapat digunakan atau diklik.

Contoh:

<!DOCTYPE html>

<html>

 

<head>

<title>

HTML atribut disabled

</title>

</head>

 

<body 

style = "text-align:center">

 

<h1 style = "color: green;">

Blog Elfan

</h1>

 

<h2>

HTML atribut disabled

</h2>

 

<p>

select field disabled.

</p>

 

<select disabled>

 

<option 

value="binary">

Binary Search

</option>

 

<option 

value="linear">

Linear Search

</option>

 

<option 

value="interpolation">

Interpolation Search

</option>

 

</select>

 

</body>

 

</html>

Output:

Blog Elfan

HTML atribut disabled

select field disabled.



<textarea>: Jika atribut disabled digunakan pada elemen textarea, maka akan membuat elemen textarea menjadi disabled yang tidak dapat digunakan atau diklik.

Contoh:

<!DOCTYPE html>

<html>

 

<head>

<title>

HTML atribut disabled

</title>

</head>

 

<body 

style = "text-align:center">

 

<h1 

style = "color: green;">

Blog Elfan 

</h1>

 

<h2>

HTML atribut disabled

</h2>

 

<!-- textarea disabled -->

<textarea disabled>

textarea disabled.

</textarea>

 

</body>

 

</html>

Output:

Blog Elfan

HTML atribut disabled



<fieldset>: Jika atribut disabled digunakan pada elemen fieldset, maka akan membuat elemen fieldset menjadi disabled yang tidak dapat digunakan atau diklik.

Contoh:

<!DOCTYPE html>

<html>

 

<head>

<title>

HTML atribut disabled

</title>

 

</head>

<body 

style = "text-align:center">

 

<h1 style = "color: green;">

Blog Elfan

</h1>

 

<h2>

HTML atribut disabled

</h2>

 

<!-- fieldset disabled -->

<p>

field disetting disabled.

</p>

 

<fieldset 

disabled>

 

Name: 

<input type="text">

<br>

 

</fieldset>

 

</body>

 

</html>

Output:

Blog Elfan

HTML atribut disabled

field disetting disabled.

Name: 


<optgroup>: Jika atribut disabled digunakan pada elemen optgroup, maka akan membuat elemen optgroup menjadi disabled yang tidak dapat digunakan atau diklik.

Contoh:

<!DOCTYPE html>

<html>

 

<head>

<title>

HTML atribut disabled

</title>

</head>

 

<body 

style = "text-align:center">

 

<h1 style = "color: green;">

Blog Elfan

</h1>

 

<h2>

HTML atribut disabled

</h2>

 

<!-- optgroup disabled -->

<select>

 

<optgroup 

label="Kendaraan German

disabled>

 

<option 

value="mercedes">

Mercedes

</option>

 

<option 

value="audi">

Audi

</option>

 

</optgroup>

 

</select>

 

</body>

 

</html>

Output:

Blog Elfan

HTML atribut disabled


Komentar

  1. Apa yang terjadi ketika sebuah elemen di-disabled?

    BalasHapus
    Balasan
    1. Ketika sebuah elemen disabled, maka elemen tersebut tidak dapat dilakukan perubahan apapun, tidak dapat difokuskan, ataupun juga tidak dapat dilakukan submit bersama form.

      Hapus
    2. User tidak dapat melakukan pengeditan ataupun fokus pada kontrol.

      Hapus
    3. Ketika elemen pendukung memiliki atribut disabled yang disetting, maka kelas semua :disabled juga berlaku untuk elemen tersebut.

      Hapus
  2. Aduh bingung juga ya melakukan disabled pada elemen pada dokumen html, daripada bingung mending rakit PC aja.

    BalasHapus

Posting Komentar

Respon komentar 7 x 24 jam, mohon bersabar jika komentar tidak langsung dipublikasi atau mendapatkan balasan secara langsung. :D

Catatan: setiap iklan yang ditayangkan pada blog ini bersumber dari google adsense. Dengan jenis iklan yang dipilih adalah, sebagai berikut.

POIN 1, Iklan yang ditampilkan hanya boleh berbahasa indonesia atau berbahasa inggris. Tidak menerima jenis iklan dalam bahasa yang lain selain yang telah disebutkan karena blog ini dibuat untuk para pengunjung dari negara atau orang yang berbahasa Indonesia.

POIN 2, Setiap gambar yang ditampilkan pada iklan sifatnya tidak mengganggu para pengunjung yang melihat blog, atau tidak boleh menampilkan gambar yang bersifat menjijikkan atau merangsang rasa mual.

POIN 3, Jenis iklan yang dipasang bukan merupakan iklan spam, atau berisi dan mengarahkan pengunjung ke alamat yang berbahaya atau bersifat penipuan.

POIN 4, Segala bentuk iklan tunduk dan patuh pada ketentuan dari pihak Adsense google dan pemilik blog.

POIN 5, Segala jenis iklan yang tidak bertentangan dengan poin 1-4 yang dijelaskan sebelumnya, maka iklan tersebut dapat ditampilkan pada blog.



~ Ikatlah Ilmu dengan Memostingkannya ~

Hot Artikel

Enkapsulasi pada Java

Perbedaan stdio.h dan stdlib.h pada Bahasa C

10 Aturan Utama Penggunaan Overriding pada Java

5 Cara Konversi Tipe Data pada Java

6 Aturan Penting Switch Statement pada Java

Perbedaan Antara int main() dan int main(void) pada Bahasa C

Penjelasan Singkat tentang Konsep Asosiasi, Komposisi, dan Agregasi pada Java