Определить, какой элемент отправил форму изнутри.

Есть ли способ определить, какой элемент отправил форму из обработчика onsubmit? Попытка написать общий обработчик, который знает, какой элемент был нажат. Например, учитывая эту форму:

<form onsubmit="onSubmitHandler">
    <input type="submit" name="submit1" />
    <input type="submit" name="submit2" />
</form>

Как я могу определить внутри onSubmitHandler, на который нажата кнопка отправки? Я попробовал event.target/event.srcElement, но это дает форму, а не фактическую кнопку отправки.

Обновление: я пишу общий элемент управления здесь, поэтому он понятия не имеет, что в форме. Решение должно работать без знания и изменения html формы. Мой откат идет по DOM, чтобы найти все кнопки, которые могут вызвать отправку, но я бы хотел этого избежать.

Ответы

Ответ 1

Альтернативным решением было бы перемещение триггера события из события отправки формы, в элемент отправки onclick, как таковой:

<form name='form1'>  
    <input type="submit" name="submit1" onclick="onSubmitHandler"/>
    <input type="submit" name="submit2" onclick="onSubmitHandler"/>
</form>

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

Ответ 2

Я бы не использовал стандартный тип кнопки отправки.

Сделайте функцию отправки, добавив дополнительный аргумент, который представляет элемент, который отправил его, и кнопка будет иметь onclick, которая отправляет this в качестве параметра:

<input type="button" onclick="submitHandler(this)">

Ответ 3

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

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

Я не могу думать ни о каком другом пути, извините.

Ответ 4

Это решение работает в Firefox. Я не проверял его в других совместимых браузерах или IE.
Я не слишком надеюсь на IE, вам нужно будет изучить его и опубликовать свои результаты.

<form id="myForm">
    <input type="submit">
    <input type="submit">
</form>

document.getElementById('myForm').addEventListener( 'submit', function( e ){
    e.preventDefault();
    e.explicitOriginalTarget.style.background = 'red';
}, false );

Ответ 5

Нажмите пузырь событий событий, чтобы вы могли просто добавить слушателя "onclick" к самой форме, которая проверяет, является ли целевой объект клика кнопкой отправки; если это так, храните ссылку на него где-нибудь, связанную с формой, доступ к которой вы можете получить от вашего обработчика onsubmit.

Если вы хотите правильно обрабатывать "Enter" -подписанные формы, прислушайтесь к форме "onkeypress" или "onkeydown", проверьте наличие "Enter" и очистите информацию о кнопке отправки, если цель события НЕ кнопку отправки.