Подтвердить что ты не робот

У меня проблемы с событием keydown и автозаполнением в Firefox на mac

Это сводит меня с ума. Его трудно объяснить, но я пойду.

У меня есть одно текстовое поле ввода на первой странице моего сайта. Я закодировал наблюдателя событий keydown, который проверяет keyCode, и если его ENTER (или equiv), itll проверит входное значение (email). Если письмо является действительным и уникальным в БД, оно отправит форму. Базовый материал, или так вы думаете.

Если я набираю свой адрес электронной почты в поле и нажимаю Enter, он отлично работает во всех браузерах. Однако, если я набираю первые пару букв, а затем с помощью клавиш со стрелками выбираю сообщение из раскрывающегося списка истории (надеюсь, что вы знаете, что я имею в виду здесь), а затем нажмите enter, результат будет другим. Значение поля формы записывается как только пара букв, которые я набрал, и поэтому проверка не выполняется. Кажется, что когда я нажимаю клавишу ввода, чтобы "выбрать" письмо из раскрывающегося списка истории, браузер прерывает это, как будто я печатаю.

В Chrome и Safari он работает так, как должен. Как это должно означать, что когда вы нажимаете клавишу ввода, чтобы "выбрать" письмо из раскрывающегося списка истории, все, что он делает, помещает этот адрес электронной почты в текстовое поле. Только на втором нажатии клавиши ENTER он запускает наблюдателя событий, и электронное письмо проверяется.

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

Спасибо Ли

EDIT: Чтобы добавить разъяснение к моему вопросу, позвольте мне добавить, что Im использует событие "keydown", чтобы зафиксировать момент нажатия клавиши ввода. Я пробовал событие "keyup", и это решило мою проблему выше, но тогда я не могу остановить подачу формы самостоятельно. Событие "keyup" запускает ПОСЛЕ по умолчанию, поэтому для него это не правильный выбор.

ДАЛЬНЕЙШЕЕ ИЗДАНИЕ:

Еще раз спасибо, и кстати, ваш английский отличный (в ответ на ваш комментарий о плохом английском).

Я изменил свой обработчик событий следующим образом:

$("emailInputBox").observe("keydown", function(event) {
    return submitViaEnter(event, submitSignupFormOne);
});

:

$("emailInputBox").observe("keydown", function(event) {
    setTimeout(submitViaEnter.curry(event, submitSignupFormOne),0);
});

submitViaEnter:

function submitViaEnter(event, callback) {
var code = event.keyCode;
if (code == Event.KEY_RETURN) {
    event.stop();
    return callback(event);
}
return true;
}

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

4b9b3361

Ответ 1

Ответ на исходный вопрос

Да, это ошибка Gecko (не Mac-специфическая, хотя).

Последняя часть этого комментария содержит описание рабочего процесса: используйте тайм-аут.

[edit], так как вы просили уточнить ошибку

Когда вы нажимаете "Enter" и активируется автозаполнение, Firefox (ошибочно) сначала запускает обработчик ключа страницы, а затем внутренний обработчик ключа браузера, который закрывает всплывающее окно автозаполнения и обновляет значение текстовой области, в то время как, возможно, он должен просто запускать он появляется во всплывающем окне автозаполнения и позволяет только странице знать значение текстового поля.

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

Когда вы добавляете вызов setTimeout к вашему обработчику ключей, вы говорите браузеру: "Эй, запустите эту функцию сразу же после того, как вы закончили делать вещи уже в списке P1 to-do". Таким образом, обработчик автозаполнения запускается, поскольку он уже находится в списке дел, затем код, который вы помещаете в тайм-аут, - когда всплывающее окно автозаполнения уже закрыто и значение текстового поля обновлено.

[edit] ответ на вопрос в разделе "Дальнейшее редактирование"

Right. Вам нужно отменить действие по умолчанию в обработчике событий, а не в тайм-ауте, если вы хотите, чтобы он работал:

function onKeyPress(ev) {
  if (... enter pressed ...) {
    setTimeout(function() {
      ... check the new textbox value after letting autocomplete work ...
    }, 0);
    // but cancel the default behavior (submitting the form) directly in the event listener
    ev.preventDefault();
    return false;
  }
}

Если вы все еще хотите отправить форму в Enter, это будет более интересное упражнение, но, похоже, вы этого не делаете.

Ответ 2

ok отсортировал его. Большое спасибо за Вашу помощь. Это была функция карри, которой я раньше не хватало. Я пытался работать над событием в рамках функции setTimeout.

Это работает ниже. SubmitViaEnter вызывается из eventobserver и отвечает на событие keyDown:

function submitViaEnter(event, callback) {
var code = event.keyCode;
if (code == Event.KEY_RETURN) {
    event.stop();
    setTimeout(callback.curry(event),0);        
    // return callback(event);
    // return false;    
}
return true;
}

Остановка действия по умолчанию внутри eventObserver означает, что никакие символы не могут быть введены. Поэтому я застрял внутри предложения if if.