Как узнать, какая кнопка отправки вызвала событие onsubmit
Если в форме имеется более одной кнопки отправки, можно ли узнать, какая из них запустила событие onsubmit , не добавляя код в сами кнопки?
Редактировать: Мне нужно выполнить проверку на стороне клиента, то есть с помощью JavaScript.
3 ответа
Событие «submit» запускается не кнопкой, а «формой». Быстрый тест доказывает это:
<form id="myform">
<input id="email" type="text" value="1st Email" />
<input id="action1" type="submit" value="Action 1" />
<input id="action2" type="submit" value="Action 2" />
</form>
<script type="text/javascript">
document.getElementById("myform").onsubmit = function(evt) {
var event = evt || window.event;
alert(event.target.id); // myform
alert(event.explicitOriginalTarget.id); // action2 (if action2 was clicked)
// but only works in firefox!
}
</script>
Хотя в firefox вы можете использовать свойство event.explicitOriginalTarget для события, чтобы получить ввод (отправить), который был нажат, что привело к срабатыванию события отправки. (если вы хотите знать)
Итак, лучшие варианты для вас:
- Иметь другое значение для ваших кнопок отправки ИЛИ
- Сделать их обычными кнопками и щелкнуть их обработчиками через javascript.
Считается ли наличие прослушивателя событий на каждой кнопке добавлением кода? В противном случае невозможно увидеть, какая кнопка вызвала событие отправки, если только вы не хотите опуститься и испачкаться, вычислить положение мыши во время события и сравнить его с положениями кнопок.
В противном случае лучше всего было бы назначить обработчик события для события нажатия кнопки и присвоить имя этой кнопки переменной, которую вы можете проверить в событии отправки формы.
Есть несколько способов, которые я могу придумать.
Вы можете использовать разные значения, и ваш ненавязчивый javascript может помочь в этом.
Одно из обсуждений этого подхода (с использованием разных значений для каждой кнопки) находится здесь:
http://www.chami.com/tips/internet/042599I.html
Я предпочитаю использовать разные имя атрибутов для каждой кнопки.
Блог об этом находится здесь: http://www.codetoad.com/javascript/multiple.asp
Я не следую ни одному из них, какой подход будет работать лучше, зависит от различные факторы, например, обрабатываете ли вы кнопки отправки в javascript, или сервер получит форму, а затем должен выяснить, что хотел пользователь.
Лично я сейчас предпочитаю использовать подход ajax, когда я просто прикрепляю события к кнопкам после загрузки страницы, используя ненавязчивый javascript, а затем на основе выбора пользователя вызываю правильную функцию, но это зависит о том, можно ли добавить ссылку скрипта на html-страницу.
ОБНОВЛЕНИЕ:
Чтобы сделать это с помощью javascript, самый простой способ — прикрепить событие по нажатию кнопки, а затем посмотреть на имя, чтобы решить, как с ним справиться.
На самом деле форму никогда не нужно отправлять на сервер, но вы можете обрабатывать все в фоновом режиме, упаковывая параметры (опции) и отправляя их на сервер, и сообщая пользователю о результатах.