Създайте персонализируеми текстови бутони в HTML използвайки вход етикет. The вход елемент се използва в рамките на форма елемент.
Чрез задаване на атрибутТип до "бутон", генерира се прост бутон, който може да се кликне. Можете да дефинирате текста, който ще се появи на бутона, като например „Изпращане“, като използвате стойност атрибут. Например:
The вход таг няма да изпрати HTML форма; трябва да включите JavaScript за обработка на подаването на данните от формуляра. Без JavaScript onclick Събитието ще изглежда като бутон, но нищо няма да се случи и ще разочаровате читателите си.
Алтернатива на етикета „бутон“
Въпреки че използвам вход етикет за създаване на бутон работи по предназначение, по-добра опция е да използвате бутон етикет, за да създадете HTML бутоните на вашия уебсайт. The бутон таг е по-гъвкав, защото ви позволява да използвате изображения за бутона (което ви помага да запазите визуална последователност, ако вашият сайтът има тема за дизайн), например, и може да бъде определен като бутон за подаване или нулиране, без да е необходима допълнителна JavaScript.
Посочете бутона Тип атрибут във всеки бутон етикети. Има три различни типа:
- бутон: Бутонът няма присъщо поведение, но се използва заедно със скриптове, които се изпълняват от страната на клиента, които могат да бъдат прикрепени към бутона и изпълнени при щракване.
- нулиране: Нулира всички стойности.
- Изпращане: Бутонът изпраща данни на формуляра на сървъра (това е стойността по подразбиране, ако не е определен тип).
Други атрибути включват:
- име: Дава на бутона референтно име.
- стойност: Указва стойност, която първоначално да бъде присвоена на бутона.
- деактивирайте: Изключва бутона.
Продължаване с бутони
HTML5 добавя допълнителни атрибути към бутон таг, който разширява функционалността му.
- автофокус: Когато страницата се зареди, тази опция указва, че този бутон е фокусът. На една страница може да се използва само един автофокус.
- форма: Свързва бутона с конкретен формуляр в същия HTML документ, като използва идентификатора на формуляра като стойност.
- формация: Използва се само с type = "submit" и URL като стойност, той указва къде ще бъдат изпратени данните от формуляра. Често дестинацията е PHP скрипт или нещо подобно,
- formenctype: Използва се само с type = "submit" атрибут. Определя как да се кодират данните на формуляра при изпращане на сървъра. Трите стойности са application / x-www-form-urlencoded (по подразбиране), multipart / form-data, и текст / обикновен.
- formmethod: Използва се само с type = "submit" атрибут. Това указва кой HTTP метод да се използва при изпращане на данни от формуляра вземете или пост.
- formnovalidate: Използва се само с type = "submit" атрибут. Данните на формуляра няма да бъдат валидирани при изпращане.
- formtarget: Използва се само с type = "submit" атрибут. Това показва къде трябва да се показва отговорът на сайта при подаване на данни от формуляра, например в нов прозорец и т.н. Опциите за стойността са или_blank, _self, _parent, _top, или конкретно име на кадър.
Прочетете повече за правене на бутони в HTML форми, и как да направите сайта си по-лесен за ползване.