OnClick не срабатывает только с одним входом при нажатии Enter

Question

У меня проблемы с событиями в Internet Explorer 7.

Когда у меня есть форма с два или более input[type=text] и я нажимаю ввод, события происходят в следующем порядке:

1. кнопка отправки (onClick)
2. форма (onSubmit)

Пример кода:

<form onSubmit="{alert('form::onSubmit'); return false;}">
    <input type="text">
    <input type="text">
    <input type="submit" onClick="{alert('button::onClick');}">
</form>

Если у меня есть только один input[type=text], и я нажимаю кнопку ввода, кнопка onClick событие не срабатывает. Пример кода:

<form onSubmit="{alert('form::onSubmit'); return false;}">
    <input type="text">
    <input type="submit" onClick="{alert('button::onClick');}">
</form>

Answer 1

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

Возможно, добавление дополнительного текстового поля может изменить порядок вкладок ваших элементов (возможно, делая кнопку в этом случае элементом управления по умолчанию)?

Answer 2

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

Если вам нужно выполнить какой-то javascript в форме, более безопасная практика - использовать отправку формы (и возвращать false, чтобы остановить отправку), а не выполнять скрипт в onClick кнопки отправки. Если вам нужно выполнить javascript от кнопки, используйте type = "button" вместо type = "submit" - надеюсь, это прояснило, что я имел в виду

Answer 3

Из любопытства вы используете DOCTYPE, и если да, то какой? Я не говорю, что несовместимость с DOCTYPE - это проблема, но режим причуд - это то, что нужно исключить, прежде чем пытаться что-либо еще.

Answer 4

Интересно, что если вы щелкнете по экрану (уберете фокус из текстового поля) во втором примере только с одним текстовым полем, событие onClick срабатывает ... Так что это не ожидаемое поведение, так как оно происходит, только когда у вас есть только одно текстовое поле и у вас есть фокус на текстовом поле.
Боюсь, вы нашли ошибку в браузере, и вам придется искать обходной путь или избегать использования события onClick в этом случае.
Я использую событие onSubmit для проверок, потому что это «более безопасное» событие, которое с большей вероятностью будет работать в разных браузерах и ситуациях.

Answer 5

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

Если вы хотите, чтобы код выполнялся, когда пользователь нажимает кнопку, и , а не , когда пользователь нажимает ввод, используйте кнопку, отличную от type = "submit".

Answer 6

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

<FORM onSubmit="{alert('form::onSubmit'); return false;}">
    <INPUT TYPE="text">
    <input type="hidden" name="dummy">
    <INPUT TYPE="submit" onClick="{alert('buttom::onClick');}">
</FORM>

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