Используйте обычную ссылку для отправки формы

Я хочу отправить форму. Но я не собираюсь использовать основной способ ввода кнопки ввода с типом отправки, а ссылкой a .

На изображении ниже показано почему. Я использую ссылки на изображения, чтобы сохранить /отправить форму. Поскольку у меня есть стандартная разметка CSS для ссылок на изображения, я не хочу использовать кнопки ввода ввода.

Я попытался применить onClick = "document.formName.submit ()" к элементу a, но я бы предпочел метод html.

alt text

Есть идеи?

108 голосов | спросил Artjom Zabelin 26 52010vEurope/Moscow11bEurope/MoscowFri, 26 Nov 2010 18:20:11 +0300 2010, 18:20:11

7 ответов


0

Два пути. Либо создайте кнопку и стилизуйте ее так, чтобы она выглядела как ссылка с CSS, либо создайте ссылку и используйте onclick="form.submit();".

ответил Jan Sverre 26 52010vEurope/Moscow11bEurope/MoscowFri, 26 Nov 2010 18:24:32 +0300 2010, 18:24:32
0

На самом деле вы не можете сделать это без какой-либо формы сценариев, насколько мне известно.

<form id="my_form">
<!-- Your Form -->    
<a href="javascript:{}" onclick="document.getElementById('my_form').submit(); return false;">submit</a>
</form>

Пример из Здесь .

ответил JonVD 26 52010vEurope/Moscow11bEurope/MoscowFri, 26 Nov 2010 18:28:01 +0300 2010, 18:28:01
0

Просто стилизация input type="submit", как это работает для меня:

 .linkButton { 
     background: none;
     border: none;
     color: #0066ff;
     text-decoration: underline;
     cursor: pointer; 
}
 <input type="submit" class="linkButton" />

Протестировано в Chrome, IE 7-9, Firefox

ответил Serj Sagan 24 PMpWed, 24 Apr 2013 20:31:16 +040031Wednesday 2013, 20:31:16
0

Вы используете изображения для отправки .. так что вы можете просто использовать type="image" для ввода "кнопки":

<input type="image" src="yourimage.png" name="yourinputname" value="yourinputvalue" />
ответил ThiefMaster 26 52010vEurope/Moscow11bEurope/MoscowFri, 26 Nov 2010 18:27:57 +0300 2010, 18:27:57
0

использование:

<input type="image" src=".."/>

или

<button type="send"><img src=".."/> + any html code</button>

плюс немного CSS

ответил atlavis 26 52010vEurope/Moscow11bEurope/MoscowFri, 26 Nov 2010 18:28:45 +0300 2010, 18:28:45
0

вы можете использовать OnClick = "document.getElementById ( 'formID_NOT_NAME'). SUBMIT ()"

ответил Sameh Helaly 23 42017vEurope/Moscow11bEurope/MoscowThu, 23 Nov 2017 15:33:17 +0300 2017, 15:33:17
0

Определенно, не существует решения с использованием чистого HTML для отправки формы со ссылкой (a). Стандартный HTML принимает только кнопки или изображения. Как говорили некоторые другие соавторы, можно смоделировать внешний вид ссылки, используя кнопку, но я думаю, что это не цель вопроса.

ИМХО, я считаю, что предложенное и принятое решение не работает.

Я проверил его в форме, и браузер не нашел ссылку на форму.

Таким образом, это можно решить, используя одну строку JavaScript, используя объект this, который ссылается на элемент, по которому щелкают является дочерним узлом формы, который необходимо отправить. Итак, this.parentNode является узлом формы. После того, как он просто вызывает метод submit() в этой форме. Нет необходимости исследовать весь документ, чтобы найти правильную форму.

<form action="http://www.greatsolutions.com.br/indexint.htm"                   
   method="get">
    <h3> Enter your name</h3>
    First Name <input type="text"  name="fname"  size="30"><br>
    Last Name <input type="text" name="lname" size="30"><br>
    <a href="#" onclick="this.parentNode.submit();"> Submit here</a>
</form>

Предположим, что я вхожу со своим именем:

 Заполненная форма

Я использовал get в атрибуте метода формы, потому что можно увидеть правильные параметры в URL на загруженной странице после отправки.

 http://www.greatsolutions.com.br/indexint.htm?fname=Paulo&lname=Buchsbaum

Это решение, очевидно, применимо к любому тегу, который принимает событие onclick или другое подобное событие.

this - отличный выбор для восстановления контекста вместе с event variable (доступно во всех основных браузерах и IE9 и далее) который может быть использован напрямую или передан в качестве аргумента функции.

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

<a href="#" onclick="event.target.parentNode.submit();"> Submit here</a>
ответил Paulo Buchsbaum 15 AM00000070000005931 2017, 07:46:59

Похожие вопросы

Популярные теги

security × 330linux × 316macos × 2827 × 268performance × 244command-line × 241sql-server × 235joomla-3.x × 222java × 189c++ × 186windows × 180cisco × 168bash × 158c# × 142gmail × 139arduino-uno × 139javascript × 134ssh × 133seo × 132mysql × 132