<button> — foydalanuvchi bosishi mumkin bo’lgan tugma yaratadigan teg. Formani yuborish, oynani ochish, amalni bajarish — tugmalar veb-sahifaning interaktivligini ta’minlaydi. <button> matn, rasm yoki boshqa elementlarni o’z ichiga olishi mumkin.
<button>— bosiladigan tugma hosil qiladigan interaktiv teg. Uningtypeatributi tugmaning vazifasini belgilaydi.
Oddiy tugma
<button> tegi orasidagi matn tugma ustida ko’rinadi:
<button>Bosing</button>
<button>Ro'yxatdan o'tish</button>
[ Bosing ] [ Ro'yxatdan o'tish ]
Tugma matni <button> va </button> orasiga yoziladi. Bu <input type="button"> dan farqli o’laroq, ichiga rasm yoki boshqa teglar joylashtirishga imkon beradi.
type atributi
<button> ning type atributi uch qiymatga ega bo’lishi mumkin. Ularni jadvalda ko’ramiz:
| type | Vazifasi |
|---|---|
submit |
formani yuboradi (standart) |
reset |
forma maydonlarini tozalaydi |
button |
oddiy tugma (maxsus vazifasiz) |
Amalda:
<button type="submit">Yuborish</button>
<button type="reset">Tozalash</button>
<button type="button">Oddiy tugma</button>
[ Yuborish ] [ Tozalash ] [ Oddiy tugma ]
Forma ichida type="submit" ma’lumotni yuboradi, type="reset" esa maydonlarni tozalaydi. Forma tashqarisida ko’pincha type="button" ishlatiladi.
JavaScript bilan bog’lash
<button> ning haqiqiy kuchi JavaScript bilan birlashganda namoyon bo’ladi. onclick atributi bosilganda amal bajaradi:
<button onclick="alert('Salom, UzbekDevs!')">Salom ber</button>
[ Salom ber ] → bosilganda: "Salom, UzbekDevs!" oynasi chiqadi
Tugma bosilganda JavaScript kodi ishga tushadi. Aynan shu bog’lanish tugmalarni interaktiv qiladi — forma yuborishdan tortib murakkab amallargacha.
Amaliy eslatma
Forma ichida <button> ning standart type qiymati submit ekanini yodda tuting — agar type ni yozmasangiz, tugma formani yuborib yuborishi mumkin. Shuning uchun oddiy amal uchun mo’ljallangan tugmalarda type="button" ni aniq ko’rsating. Bu kutilmagan forma yuborilishining oldini oladi.
Xulosa
Bu bo’limda <button> tegini, type atributining uch qiymatini (submit, reset, button) va uni JavaScript bilan bog’lashni ko’rib chiqdik. <button> — interaktiv sahifaning asosiy elementi. Keyingi darsda <canvas> tegiga o’tamiz.