Düğmeye Kod Nasıl Eklenir

İçindekiler:

Düğmeye Kod Nasıl Eklenir
Düğmeye Kod Nasıl Eklenir

Video: Düğmeye Kod Nasıl Eklenir

Video: Düğmeye Kod Nasıl Eklenir
Video: Excel - Buton/Düğme Oluşturmak (Makro Kaydı Yapımı) 2024, Mayıs
Anonim

Web sayfalarındaki butonlar, etkileşimli kullanıcı deneyimi sağlamak için kullanılır. Kural olarak, bir düğme tıklamasına verilen yanıt, sunucuya veri gönderilmesini gerektirmiyorsa, etkileşim JavaScript komut dosyaları kullanılarak gerçekleştirilir. Karşılık gelen JavaScript kodunu çağırma yöntemleri değişebilir - aşağıda farklı türlerdeki düğmeler için birkaç olası seçenek bulunmaktadır.

Düğmeye kod nasıl eklenir
Düğmeye kod nasıl eklenir

Talimatlar

Aşama 1

Bir web sayfasındaki bir düğmenin görüntüsü düğme etiketi kullanılarak düzenlenirse, JavaScript kodu onclick niteliğine yerleştirilebilir. Örneğin, şöyle: button Elbette, yeterince büyük kodu doğrudan button etiketine koymak tavsiye edilmez - onu bir fonksiyon olarak tasarlamak ve onclick niteliğine sadece bu fonksiyonu çağırmak için kodu koymak daha iyidir. Örneğin:

fonksiyon showAlert () {

uyarı ('Düğme tıklandı!')

}

buton

Adım 2

Düğme, giriş etiketi varyasyonlarından biri (gönder, sıfırla, düğme veya resim) aracılığıyla görüntüleniyorsa, aynı onclick özniteliği kullanılabilir. Örneğin, form alanlarını temizlemek (sıfırlamak) için bir düğme için kod şöyle görünebilir: Düğme tıklandığında yalnızca JavaScript'in yürütülmesini istiyorsanız ve varsayılan eylem gerçekleşmiyorsa, geri dönüş komutunu işlevine veya doğrudan onclick niteliğine false. Örneğin:

Aşama 3

Gönderme türündeki bir düğmeyi tıklatmak için bir yanıt düzenlemeniz gerekiyorsa, onclick özniteliğini kullanan yukarıdaki yönteme ek olarak, bu düğmenin ait olduğu form etiketinin özelliklerini kullanabilirsiniz. Karşılık gelen işlev çağrısı, form etiketinin onsubmit özniteliğine yerleştirilebilir. Örneğin:

4. Adım

Düğme bir form öğesi değil, yalnızca bir grafik öğesi (img etiketi) ise, bunun için standartlar onclick niteliğinin kullanılmasına da izin verir. Örneğin:

Adım 5

Düğme bir köprü ise, düğmenin özniteliklerini kullanmamalısınız; bağlantı etiketinin özelliklerini kullanmak daha iyidir. Önceki seçeneklerde olduğu gibi onclick etiketini kullanabilirsiniz. Örneğin: Ve href özelliğindeki adresi bir işlev çağrısı ile değiştirebilirsiniz. Örneğin, bunun gibi:

Önerilen: