Darsliklar HTML <button>

HTML HTML <button>

<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. Uning type atributi 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.