У меня есть проблемы с keydown событием и автоматическим заполнением в Firefox на Mac

Это сводит меня с ума. Это - жесткое для объяснения, но я буду делать попытку.

У меня есть входное текстовое поле того на первой полосе моего сайта. Я кодировал keydown наблюдателя события, который проверяет код клавиши и если ВХОДИТЬ (или equiv), itll проверяют входное значение (электронная почта). Если электронная почта действительна и уникальна в DB itll, отправляют форму. Основной материал, или таким образом, Вы думали бы.

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

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

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

Спасибо Lee

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

ДАЛЬНЕЙШЕЕ РЕДАКТИРОВАНИЕ:

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

Я изменил свой обработчик событий от этого:

$("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 функция, что означает форму, отправляется, когда я совершил нападки, ВХОДЯТ.

12
задан TessellatingHeckler 28 May 2015 в 18:09
поделиться

2 ответа

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

Да, это ошибка Gecko (правда, не специфичная для Mac).

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

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

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

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

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

[править], отвечая на вопрос в разделе «Дальнейшее редактирование»

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

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, это было бы более интересным упражнением, но это не так. Похоже, ты знаешь.

7
ответ дан 2 December 2019 в 22:37
поделиться

ок, разобрался. Большое спасибо за помощь. Это была функция curry, которой мне не хватало раньше. Я пытался работать с событием внутри области видимости функции 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 ENTER.

2
ответ дан 2 December 2019 в 22:37
поделиться
Другие вопросы по тегам:

Похожие вопросы: