HTML таг button

Пример

Кратък пример как се използва тагът <button>.

<button type="button" class="btn btn-primary" onclick="alert('Здравей!')">
  Натисни ме
</button>
Опитай в редактора

Дефиниция и употреба

Тагът <button> създава интерактивен бутон в HTML, който може да се използва за изпращане на формуляри, задействане на JavaScript действия или други интеракции с потребителя.

По подразбиране бутонът е фокусируем и може да се активира с мишка, клавиатура (клавиш Enter или Space) и чрез скрийн рийдъри, което го прави подходящ за достъпни интерфейси.

Най-често се използват следните стойности на атрибута type:

  • type="button" – обикновен бутон, който не изпраща формуляр; използва се за JavaScript действия.
  • type="submit" – бутон за изпращане на формуляр.
  • type="reset" – нулира (връща началните стойности) на полетата във формуляра.

Съдържанието вътре в <button> може да бъде текст, икони или други HTML елементи (напр. <span>, <i>), което го прави по-гъвкав от <input type="button">.

При използване с Bootstrap 5.3, към бутона се добавят класове като btn, btn-primary, btn-outline-secondary и др., за да се приложи готов стил и поведение.

Browser Support

BrowserПоддръжка

Chrome
✔️

Firefox
✔️

Edge
✔️

Safari
✔️

Opera
✔️

Атрибути

Атрибут Описание Стойности
type Определя типа на бутона и поведението му във формуляр. button, submit, reset
name Име на бутона, изпращано с формуляра. Текстова стойност
value Стойност, която се изпраща към сървъра при изпращане на формуляра. Текстова стойност
disabled Деактивира бутона (не може да се натиска и не се фокусира). disabled (булев атрибут)
form Свързва бутона с формуляр по id, дори да не е вътре в него. Идентификатор на формуляр
formaction Презаписва action атрибута на формуляра за този бутон (само за type="submit"). URL
formmethod Презаписва method на формуляра (само за type="submit"). get, post
formtarget Определя къде да се отвори резултатът от изпращането. _self, _blank, _parent, _top, име на прозорец
formenctype Тип кодиране на данните при изпращане (само за method="post"). application/x-www-form-urlencoded, multipart/form-data, text/plain
formnovalidate Изключва HTML5 валидацията за този бутон при изпращане. formnovalidate (булев атрибут)
autofocus Автоматично поставя фокуса върху бутона при зареждане на страницата. autofocus (булев атрибут)