Изначально меня смущало то, что я не понимал, как соглашения для кодирования обработчиков событий на самом деле работали по сравнению с тем, что было именованной переменной , в сочетании с неявными вызовами, выполняемыми обработчиками Javascript когда вы устанавливаете обработчики событий следующим образом:
Хорошо 1
document.getElementById('testId').onkeypress = function(e) {
console.log(e.which);
}
Выше, ваш браузер неявно передает event обработчику в качестве первого аргумента функции, так что вы можете назвать свой параметр (здесь e) как хотите, если вы согласны , даже если вы сходите с ума, как это:
Хорошо 2; творчески названный
document.getElementById('testId').onkeypress = function(aWhopBopALuWhop) {
console.log(aWhopBopALuWhop.which);
}
Но из-за того, что event используется в качестве глобального , грубый код, подобный этому, также работает:
Сырая область 1
document.getElementById('testId').onkeypress = function(aWhopBopALuWhop) {
console.log(event.which); // <<< decidedly NOT aWhopBopALuWhop
}
Таким образом, вы также можете увидеть вдвойне грубый код, подобный этому:
Cruddy Scoping 2
document.getElementById('testId').onkeypress = function(event) {
console.log(event.which);
}
Теперь, какой event является event? К сожалению, это не имеет значения. Независимо от области видимости, мы помещаем event в event, поэтому event === event во всем! [sic]
Но это показывает, что event не является зарезервированным словом. Это переменная. Поэтому, когда вы не можете сказать break = "spam";, вы можете сказать event = "spam";. Так что, если вы попытаетесь использовать break, который зарезервирован , он потерпит неудачу.
document.getElementById('testId').onkeypress = function(break) {
console.log(break.which);
}
Что важно выучить (и что Ionut по сути говорит, я полагаю ), это то, что ваш браузер тихо передает "глобальный" event var в ваш onkeypress обработчик независимо от того, что вы называете в определении функции. Даже если вы не используете свой параметр для доступа к event в своем обработчике, вы все равно можете обращаться к event как к глобальному, как показано в Cruddy 1 & 2 , выше.
Теперь, когда я звонил из html-страны с onkeypress, в моей голове начали смешиваться парадигмы. Здесь нет тихой передачи event в аргументы вашей функции-обработчика. Вы должны явно передать event себя, например, так:
<script>
function handlerNamed(namedParam) {
console.log(namedParam.which);
}
</script>
<input type="text" size="10" onkeypress="handlerNamed(event)"><br />
Никаких других соглашений не работает! И это работает только потому, что браузеры его поддерживают, а не потому, что какой-либо стандарт ECMAscript определяет event (afaik). Вы не можете использовать что-либо из нижеперечисленного, как вы «могли» с .onKeyPress, изменив имя параметра для сопоставления в handlerNamed:
<!-- NONE OF THESE WORK, b/c ONLY event is defined! -->
<input type="text" size="10" onkeypress="handlerNamed(evt)"><br />
<input type="text" size="10" onkeypress="handlerNamed(e)"><br />
<input type="text" size="10" onkeypress="handlerNamed(aWhopBopALuWhop)"><br />
Имеет смысл? Я был в середине слишком сложного jsFiddle , пытавшегося записать это, прежде чем он наконец щелкнул на случай, если это будет полезно.