Безопасно ли использовать привязку для отправки формы?

ProgramBox

Безопасно ли использовать привязку для отправки формы?

Post author:admin
Запись опубликована:20 февраля, 2023
Post category:Вопросы по программированию

#html #forms #button #anchor

#HTML #формы #кнопка #привязка

Вопрос:

Я где-то читал, что использование тега привязки для отправки формы не очень безопасно, поэтому у меня вопрос: безопасно ли использовать тег привязки вместо <button> или <input type="submit" /> для отправки формы? И если это не так, почему? Проблема в том, что у меня есть класс CSS для кнопки, который показывает, что я хочу <a class="button"> , но если я добавлю его к реальной кнопке, это добавит странную границу, которую я не хочу.

Спасибо

1. Вы должны попытаться настроить свой стиль <input type="submit" /> в соответствии с вашими потребностями. Пожалуйста, опубликуйте CSS вашей текущей версии, чтобы мы могли найти способ удалить странную границу 🙂

2. Спасибо, я уже исправил границу. Я определил только верхнюю и нижнюю границы, поэтому по бокам была граница по умолчанию.

Ответ №1:

Для использования привязки для отправки формы потребуется использование JavaScript для подключения событий. Это небезопасно, поскольку, если у пользователя отключен JavaScript, вы не сможете отправить форму. Например:

 <form id="form1" action="" method="post">
    <a href="#" onclick="document.getElementById('form1').submit();">Submit!</a>
</form>

Если вы хотите, вы можете использовать <button> :

 <button type="submit">Submit!</button>

Или придерживайтесь того, что мы все знаем:

 <input type="submit" value="Submit!" />

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

1. Действительно. Но, к счастью, вы можете оформить кнопку так, как будто это a . Просто удалите границу из стиля, который у вас есть в данный момент. Кстати, использование <button> имеет ту же проблему. Используйте <input type="submit"> .

2. Хотя количество пользователей, у которых отключен Javascript, действительно мало в большинстве настроек.

3. @nfechner Конечно, но зачем рисковать и прилагать усилия, если есть совершенно хороший элемент, в который эта функциональность встроена примерно с 1872 года.

4. @GolezTrol re: зачем рисковать. Оформление тегов привязки намного проще, чем оформление кнопок ввода, и они более согласованы с различными стилями, применяемыми в разных браузерах. Библиотеки, такие как Bootstrap, абстрагируют сложность стилизации, чтобы тег привязки и ввод выглядели одинаково, но если вы не используете одну из этих библиотек, использование тегов привязки по всему сайту может сделать вещи чище с точки зрения рендеринга и стилизации.

5. ввод, кнопка не имеет допустимого состояния:hover в IE, и это псевдокласс в других браузерах. Я бы предпочел получить 0,01% пользователей, которые в противном случае не смогли бы использовать мое веб-приложение с отключенным JavaScript, чем использовать библиотеку, чтобы заставить:hover работать в IE (кроме того, Pagespeed жалуется на проблемы с производительностью при этом).

Ответ №2:

 <!-- add the anchor token at the end of your action statement -->

<form method='post' action='this_page.php?put_peram=token#anchor_name'>
<input type='submit' value='click here'>

<!-- put the anchor right above where you want the page to  index -->

<a name="anchor_name></a>

Ответ №3:

Старайтесь избегать javascript для действия. Используйте всегда кнопку отправки. У некоторых пользователей может быть отключен javascript в целях безопасности.

Хотя вы хотите использовать javascript для отправки значения, добавьте строку ниже перед написанием <html> тега.

 <html>