Создание HTML-кнопок на формах

Использование тега ввода для отправки форм

HTML-формы являются одним из основных способов добавить интерактивность на ваш сайт. Вы можете задавать вопросы и запрашивать ответы у своих читателей, предоставлять дополнительную информацию из баз данных, настраивать игры и многое другое. Существует ряд элементов HTML, которые можно использовать для создания форм. И после того, как вы создали свою форму, есть много разных способов отправить эти данные на сервер или просто запустить действие формы.

Вы можете отправить свои формы несколькими способами:

    • Это наиболее распространенный способ передачи данных на сервер, но он может быть очень простым.
    • Использование изображения позволяет легко настроить кнопку отправки в соответствии со стилем вашего сайта. Но некоторые люди могут не распознать его как кнопку отправки.
    • Тэг кнопки
       INPUT 

      предоставляет множество тех же опций, что и тег

       INPUT 

      , но больше похож на стандартный тип отправки. Для активации требуется JavaScript.

    • Тег

       BUTTON 

      является более универсальным типом кнопки, чем тег

       INPUT 

      . Этот тег требует Javacript для активации.

    • Элемент

       COMMAND 

      является новым в HTML5 и предоставляет способ активации сценариев и форм с соответствующими действиями. Активируется с помощью JavaScript.

Элемент ВВОДА

Вход
Элемент

 INPUT 

является наиболее распространенным способом отправки формы, все, что вам нужно сделать, это выбрать тип (

 button 

,

 image 

или

 submit 

) и при необходимости добавьте несколько сценариев для отправки в действие формы.

Элемент может быть написан просто так. Но если вы это сделаете, у вас будут разные результаты в разных браузерах. В большинстве браузеров есть кнопка с надписью «Отправить», но Firefox создает кнопку с надписью «Отправить запрос». Чтобы изменить то, что говорит эта кнопка, вы должны добавить атрибут:

 value = "Отправить форму"> 

Элемент написан так, но если вы пропустите все остальные атрибуты, все, что будет отображаться в браузерах, это пустая серая кнопка. Чтобы добавить текст к кнопке, используйте

 значение 

атрибут. Но эта кнопка не отправит форму, если вы не используете JavaScript.

 onclick = "submit ();"> 

Это похоже на
Тип

 button 

, которому нужен скрипт для отправки формы. За исключением того, что вместо текстового значения вам нужно добавить URL источника изображения.

 src = "submit.gif"> 

Элемент кнопки

Элемент

 BUTTON 

требует как открывающий тег, так и закрывающий тег. Когда вы используете его, любой контент, который вы заключаете в тег, будет заключен в кнопку. Затем вы активируете кнопку скриптом.

 Отправить форму 

Вы можете включать изображения в свою кнопку или комбинировать изображения и текст, чтобы создать более интересную кнопку.

 Отправить форму 

Командный элемент

Элемент

 COMMAND 

является новым в HTML5. Он не требует использования

 FORM 

, но может действовать как кнопка отправки формы. Этот элемент позволяет создавать больше интерактивных страниц, не требуя форм, если вам действительно не нужны формы. Если вы хотите, чтобы команда что-то сказала, вы записываете информацию в атрибут

 label 

.

 label = "Отправить форму"> 

Если вы хотите, чтобы ваша команда была представлена ​​изображением, вы используете

 значок 

атрибут.

 icon = "submit.gif"> 

HTML-формы имеют несколько разных способов отправки, как вы узнали на предыдущей странице. Два из этих методов

 Вводится тег 

и

 КНОПКА <пред /> тег. Есть веские причины использовать оба этих элемента.

Входной элемент

Тег - это самый простой способ отправить форму. Это не требует ничего кроме самого тега, даже

 value 

Когда клиент нажимает на кнопку, он отправляется автоматически. Вам не нужно добавлять какие-либо скрипты, браузеры знают, что нужно отправлять форму при нажатии на тег

 INPUT 

.

Проблема в том, что эта кнопка очень некрасивая и простая. Вы не можете добавлять изображения к нему. Вы можете оформить его так же, как любой другой элемент, но он все равно может выглядеть как уродливая кнопка.

Использовать
Метод

 INPUT 

, когда ваша форма должна быть доступна даже в браузерах, у которых отключен JavaScript.

КНОПКА Element

Элемент

 BUTTON 

предлагает больше возможностей для отправки форм. Вы можете поместить что-нибудь в элемент

 BUTTON 

и превратить его в кнопку отправки. Чаще всего люди используют изображения и текст. Но вы можете создать

 DIV 

и сделать все это кнопкой отправки, если хотите.

Самый большой недостаток
Элемент

 BUTTON 

заключается в том, что он не отправляет форму автоматически. Это означает, что для активации должен быть какой-то тип сценария.И поэтому он менее доступен, чем метод

 INPUT 

. Любой пользователь, у которого не включен JavaScript, не сможет отправить форму только с элементом

 BUTTON 

для ее отправки.

Использовать
Метод

 BUTTON 

для форм, которые не так критичны. Кроме того, это отличный способ добавить дополнительные параметры отправки в одной форме.

Оцените статью
Solutics.ru
Добавить комментарий