在这种情况下如何避免修改事件对象 [英] How to avoid to modify the event object in this situation
问题描述
这个问题与此问题有关自动完成：仅当用户在Tab键上键入时，才会关注第一项。
This question is related to this one Autocomplete: first item focused only when the user type on tab key.
为了使第一项仅在用户在选项卡上键入时聚焦使用jqueryUi键可以制作类似这样的内容 http://jsfiddle.net/uymYJ/8/（1）。
In order to make the first item focused only when the user type on tab key by using jqueryUi is possible to make something like this http://jsfiddle.net/uymYJ/8/ (1).
这个实现的坏处是修改了事件对象 event.keyCode = $ .ui.keyCode.DOWN; 。
实际上通过这种方式，它将影响此事件上的所有其他侦听器：稍后运行的keydown事件上的所有侦听器（包括所有委托的侦听器）都将event.keycode视为是$ .ui.keyCode.ENTER。
The bad thing about this implementation is the modification of the event object event.keyCode = $.ui.keyCode.DOWN;.
In fact by doing this way, it will impact all other listeners on this event: all listener on the keydown event running later (which includes all delegated listeners) will see the event.keycode as being $.ui.keyCode.ENTER.
我的问题是：
1）我对的担忧是对事件对象的修改有道理吗？如果不是为什么？
2）你能否建议另一种方法来达到相同的结果？
3）@AaronDigulla建议的一个选择可能是使用 document.createEvent（）。在此上下文中使用此方法的正确方法是什么？我确实尝试了以下代码（3），但它不起作用。
My questions are:
1) Are my concerns about the modification of the event object justified? If not why?
2) Can you suggest another way to achieve the same result?
3) One opition, as suggested by @AaronDigulla, could be to use document.createEvent(). What is the proper way to use this method in this context? I did try the following code (3) but it does not work.
PS：
这是关于自动完成的代码（2）。
P.S.:
Here is the code about autocomplete (2).
（1）
$("#box").keydown(function(e){
if( e.keyCode != $.ui.keyCode.TAB) return;
e.keyCode = $.ui.keyCode.DOWN;
$(this).trigger(e);
e.keyCode = $.ui.keyCode.ENTER;
$(this).trigger(e);
$(this).siblings("input").select();
});
（2）
(2)
function (e) {
var f = typeof e == "string",
g = Array.prototype.slice.call(arguments, 1),
h = this;
return e = !f && g.length ? a.extend.apply(null, [!0, e].concat(g)) : e, f && e.charAt(0) === "_" ? h : (f ? this.each(function () {
var d = a.data(this, c),
f = d && a.isFunction(d[e]) ? d[e].apply(d, g) : d;
if (f !== d && f !== b) return h = f, !1
}) : this.each(function () {
var b = a.data(this, c);
b ? b.option(e || {})._init() : a.data(this, c, new d(e, this))
}), h)
}
（3）
(3)
$("#box").keydown(function(){
e = document.createEvent('KeyboardEvent');
e.initEvent("keydown", true, true);
$(this).dispatchEvent(e);
if( e.keyCode != $.ui.keyCode.TAB) return;
e.keyCode = $.ui.keyCode.DOWN;
$(this).trigger(e);
e.keyCode = $.ui.keyCode.ENTER;
$(this).trigger(e);
$(this).siblings("input").select();
});
推荐答案
你是对的：事件将被修改为所有听众都会看到修改后的密钥代码。
You're correct: The event will be modified an all listeners will see the modified key code.
但更重要的问题是：这有危险吗？
But the more important question is: Is this dangerous?
要回答这个问题，我们需要知道哪些侦听器绑定到该元素。当然，自动完成插件中的所有侦听器都是为处理这种情况而设计的。对他们来说，这没关系。
To answer this, we need to know which listeners are bound to the element. Surely, all the listeners from the autocomplete plugin are designed to handle this situation. For them, this is OK.
当您将自己的事件绑定到小部件时，麻烦就开始了。
The trouble starts when you bind your own events to the widgets.
解决方案是创建新事件（使用 document.createEvent（） +复制所有重要属性）并发送克隆以避免修改原始事件。
A solution would be to create new events (using document.createEvent() + copying all important attributes) and send the clone to avoid modifying the original event.
一些链接：
- 键盘事件和代码（显示您键入时事件的字段）
- KeyboardEvent
- jQuery.Event 有帮助代码来创建和使用事件 $ b来自Dynamic的$ b
- 了解键盘事件数据 HTML：明确的参考nce，2E。第6章：脚本事件
- Keyboard Events and Codes (shows the fields of the events as you type)
- KeyboardEvent from the Mozilla Developer Network
- jQuery.Event has helper code to create and work with events
- Understanding Keyboard Event Data from Dynamic HTML: The Definitive Reference, 2E. Chapter 6: Scripting Events
这篇关于在这种情况下如何避免修改事件对象的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
