.focus（函数）选择多个

这个问题已被问过很多次，但是我没有看到“多种”变种的任何答案：

http://jsfiddle.net/queZ6/107/

当您在框中选中时，我想显示警报并捕获焦点事件。 我基本上想要更改围绕每个输入的元素的突出显示，随后填写表单时。 它基本上是一个信号，用户可以轻松查看他们的字段。

我不能为我的生活弄清楚如何捕捉焦点事件，虽然tabbing到框中（或显然也点击它）。

考虑到你输入INTO输入，我不明白为什么这很难。 不能javascript看到新创建的输入（你输入的内容）并绑定到那个？ JS有时候让我很困惑：S

Answer 1

更新：

虽然旧答案声明您无法绑定到动态创建的元素（这在某种程度上仍然如此），但对该插件的更新使这不再是一个问题。

虽然有问题的插件仍然存在多次触发处理程序的问题，但在使用警报消息的情况下，由于更新，现在可以绑定到那些动态创建的元素。

为了做到这一点，所有人必须这样做才能通过.on()绑定到原始目标选择列表上的chosen:showing_dropdown事件。

但是，为了解决连续创建的警告框的问题，我决定使用underscore.js的 .debounce()方法，因此它只会每1秒立即触发一次。

下划线库绝不是必需的，但是你需要有一些去抖function才能绕过这个小怪癖。

 var debouncedAlert = _.debounce(window.alert, 1000, true); $('#select').chosen(); $('#select').on('chosen:showing_dropdown', function(e){ e.preventDefault(); e.stopPropagation(); debouncedAlert('focused'); }); 

工作范例：

 $(document).ready(function() { var debouncedAlert = _.debounce(window.alert, 1000, true); $('#select').chosen(); $('#select').on('chosen:showing_dropdown', function(e){ e.preventDefault(); e.stopPropagation(); debouncedAlert('focused'); }); $('button').click(function() { $('#select').trigger('chosen:open'); }); }); 

 body { margin: 10px; } select { width: 200px; } 

     
  abc def ghi  
 Press this button. Now chosen will be focused! :) 

Answer 2

因为元素是动态创建的，所以您需要使用jquery的on来使用事件委托 。 这将允许您在元素存在之前附加处理程序。

 $('.chzn-choices').focus(function(e){ 

反而会

 $("container").on("focus", '.chzn-choices',function(e){ 

其中container是一些静态祖先元素的选择器，它不是动态加载的。 如果不存在这样的容器，则可以使用document ，尽管应尽可能避免使用。