JavaScript ile Butonu Devre Dışı Bırakma (Butonu Pasif Yapma)

[turkmedia]

JavaScript, bir web sayfasındaki dinamik öğeleri yönetmek için kullanılan bir programlama dili dir. Bu dili kullanarak bir butonu devre dışı bırakabilirsiniz.

Butonu devre dışı bırakmanın iki yolu vardır:

HTML kodundaki “disabled” özelliğini kullanma:

<button id="myButton" disabled>My Button</button>

Bu yöntem, butonu HTML kodunda direk olarak “disabled” özelliği eklenerek yapılır. Böylece buton varsayılan olarak devre dışıdır.

JavaScript kodu ile “disabled” özelliğini dinamik olarak ayarlama:

<button id="myButton">My Button</button>
 
<script>
  const button = document.getElementById("myButton");
  button.disabled = true;
</script>

Bu yöntemde, buton HTML kodunda devre dışı değildir ve JavaScript kodu ile dinamik olarak devre dışı hale getirilir.

Butona Tıklayınca Devre Dışı Bırakma​

Bir butonun tıklama olayı sırasında devre dışı hale getirilmesi de mümkündür. Bunun için aşağıdaki JavaScript kodunu kullanabilirsiniz:

1 2 3 4 5 6 7 8 9 10

<button id="myButton">My Button</button> <script> const button = document.getElementById("myButton"); button.addEventListener("click", function () { button.disabled = true; }); </script>

Bu kod, düğmenin “click” olayı dinlenir ve olay gerçekleştiğinde düğme devre dışı hale getirilir. Kullanıcı düğmeye tekrar tıklama yapamaz.

İster HTML kodu ile direk olarak, ister JavaScript kodu ile dinamik olarak yapın, düğme devre dışı hale getirildiğinde kullanıcılar tarafından tıklama yapılamaz.