IE, не инициировавший событие клавиатуры на форме с ОДНИМ ПОЛЕМ
Я вижу код своего Друга здесь...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> Check action </TITLE>
<script>
function detectEvent(){
if(window.event.keyCode==13)
{
alert("you hit return!");
}
}
</script>
</HEAD>
<BODY>
<form name="name1" onkeyup="detectEvent()" action="page2.html">
<p> Field1
<input type="text" id="text1"/>
</p>
</form>
</BODY>
</HTML>
и когда он попытался ввести значение в текстовое поле и нажал Enter, оно не назвало detectEvent (). Я сказал, это будет всегда обращаться к onSubmit, вводят кнопку....., и он удивил меня,
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> Check action </TITLE>
<script>
function detectEvent(){
if(window.event.keyCode==13)
{
alert("you hit return!");
}
}
</script>
</HEAD>
<BODY>
<form name="name1" onkeyup="detectEvent()" action="page2.html">
<p> Field1
<input type="text" id="text1"/>
</p>
<p> Field1
<input type="text" id="text2"/>
</p>
</form>
</BODY>
</HTML>
Теперь нажмите Enter, функция вызвана..... Как же так!?
Почему onKeyUp не обратился к формам со всего одним полем.!!! я пропускаю что-то?
2 ответа
Порядок событий:
keydown
keypress
submit
keyup
Итак, к моменту вызова обработчика keyup форма уже начала отправляться. Если действие формы представляет собой page2.html в локальной файловой системе, то он будет перемещаться очень быстро и, вероятно, уйдет со страницы до того, как клавиша сможет называться; с другой стороны, установите действие на внешний сайт, и keyup успеет сработать.
Добавление второго поля ввода - это другая проблема: в этом случае форма вообще не отправляется. Это любопытная историческая причуда, заключающаяся в том, что браузеры отправляют форму, в которой есть только один ввод и нет кнопки отправки, но отказываются отправлять форму с более чем одним вводом и без кнопки отправки. Это восходит к спецификации HTML 2.0:
Когда в форме есть только одно однострочное текстовое поле ввода, пользовательский агент должен принять Enter в этом поле как запрос на отправку формы.
В HTML 2.0 не указывалось, следует ли принимать Enter для отправки формы в любых других обстоятельствах (похоже, намерение состояло только в том, чтобы дублировать функциональность древнего элемента ) , но современные браузеры, похоже, интерпретировали это как то, что отправка Enter не должна происходить там, где есть несколько полей, но тогда любая кнопка отправки вызывает отправку Enter в любом случае. IE и другие более поздние браузеры скопировали это странное поведение.
Несвязанный момент: зависимость от window.event делает код ненужным только для IE.Для всех других браузеров объект события передается в качестве аргумента функции обработчика событий. Вы можете выполнить onkeyup = "detectEvent (event)" в HTML, а затем использовать этот аргумент в функции detectEvent , которая работает в обеих моделях, потому что либо локальный аргумент событие или глобальное window.event . Но обычным подходом было бы потерять атрибут обработчика событий и назначить его из JavaScript:
<form action="page2.html" id="enterform">
<p> Field1
<input type="text" id="text1">
<!-- Note: *no* trailing slash - the doctype says HTML4, not XHTML -->
</p>
</form>
<script type="text/javascript">
document.getElementById('enterform').onkeyup= function(event) {
if (event===undefined) event= window.event; // for IE
if (event.keyCode===13)
alert('You pressed Enter');
};
</script>
Сказав все это ... Я вообще с подозрением отношусь к захвату клавиши Enter. Я не совсем уверен, что вы пытаетесь сделать, но если это обычный случай изменения кнопки по умолчанию в форме, это определенно не способ сделать это и вызовет ряд проблем. Нет веских причин, по которым вы должны удерживать клавишу Enter для вызова .submit () в форме.
Интересно, что в Google Chrome форма со вторым полем ввода по-прежнему будет отправляться, поэтому она никогда не улавливает клавишу ввода при событии нажатия клавиши, независимо от того, сколько полей у вас есть.
Решение = используйте нажатие или нажатие клавиши.