HTML-форма с одним текстовым полем + предотвращение обратной передачи в Internet Explorer - PullRequest
2 голосов
/ 16 апреля 2009

Я заметил довольно странное поведение в IE.

У меня есть HTML-форма с одним полем ввода текста и кнопкой отправки

При нажатии кнопки Отправить мне нужно выполнить функцию JavaScript на стороне клиента, которая выполняет необходимые действия.

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

Я добавил функцию JavaScript нажатия клавиш, которая выглядит следующим образом:


<input type=text onkeypress="return OnEnterKeyPress(event)" />

 function OnEnterKeyPress(event) {
            var keyNum = 0;
            if (window.event) // IE
            {
                keyNum = event.keyCode;
            }
            else if (event.which) // Netscape/Firefox/Opera
            {
                keyNum = event.which;
            }
            else return true;  
            if (keyNum == 13) // Enter Key pressed, then start search, else do nothing.
            {
                OnButtonClick();
                return false;
            }
            else
                return true;
        }

Удивительно, но это не работает.


Но если я передам текстовое поле функции:

<input type=text onkeypress="return OnEnterKeyPress(this,event);" />

 function OnEnterKeyPress(thisForm,event) {
            var keyNum = 0;
            if (window.event) // IE
            {
                keyNum = event.keyCode;
            }
            else if (event.which) // Netscape/Firefox/Opera
            {
                keyNum = event.which;
            }
            else return true;  
            if (keyNum == 13) // Enter Key pressed, then start search, else do nothing.
            {
                OnButtonClick();
                return false;
            }
            else
                return true;
        }

Я могу предотвратить обратную передачу.

Кто-нибудь может подтвердить, что именно здесь происходит?

форма HTML содержит только одно текстовое поле и кнопку отправки

Результирующее o / p функции JavaScript, выполняемой при отправке, отображается в текстовой области HTML в отдельном div.

Ответы [ 5 ]

8 голосов
/ 17 апреля 2009

Найден обходной путь для этой проблемы.

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

Итак, я ввел скрытое текстовое поле в форму, и все работает волшебным образом. Мне даже не нужно обрабатывать событие onkeypress для текстового поля.

<Form>
    <input type="text" />
    <input type="text" style="display:none"/>
    <input type="submit" onClick="callPageMethod();return false;"/>
</Form>

Это прекрасно работает для меня !!

Это не проблема в FF, так как нажатие клавиши enter приводит к вызову для отправки события нажатия кнопки.

1 голос
/ 23 июля 2010

Привет, вы также можете отключить поведение по умолчанию.

jQuery('#yourInput').keydown(function (e) {
  if (e.keyCode == 13) {
    e.preventDefault();
  }
});

Ура! * * 1004

0 голосов
/ 03 июня 2010

Только что пришли сюда из-за связанных наблюдений по крайней мере с IE 7 и 8:

Если в форме есть только один ввод текста и одна кнопка отправки, а пользователь нажимает клавишу возврата, IE не будет включать в запрос пару имя / значение кнопки отправки. Insead, там будет только значение ввода текста.

Если я добавлю другой текстовый ввод, будут опубликованы как текстовые входы, так и параметры кнопки отправки. Второй ввод текста может быть даже скрыт: <input type="text" style="display:none"/>

Так что не связано с событиями, а скорее с простой отправкой формы.

Это происходит с GET и POST. Добавление элемента select в форму не меняет поведение. - очень странно.

0 голосов
/ 16 апреля 2009

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

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

Например, как предполагает altCognito, пусть form.onsubmit возвращает false, поэтому форма никогда не отправляется в ответ на взаимодействие с пользователем. Кроме того, если вы поместите свой код AJAX (при условии, что это то, что вы делаете) в обработчик onsubmit вместо нажатия кнопки на кнопке, вы также можете сделать так, чтобы нажатие клавиши Enter имело тот же эффект, что и нажатие кнопки подтверждения пользователь обычно может ожидать.

Если вы этого не хотите, кажется, нет никакой причины вообще включать элемент . Совершенно справедливо просто размещать элементы ввода отдельно, если вы не ожидаете, что браузер отправит их куда-либо.

0 голосов
/ 16 апреля 2009

Вернуть false в onsubmit, который используется для отправки формы через JavaScript.

...