select2强调页面加载

我正在尝试使一个select2框在页面加载时出现在其聚焦状态。 我已经尝试了以下内容：

$('#id').select2('focus'); $('#id').trigger('click'); $('#id').trigger('focus'); 

只有第一行似乎有任何效果，它会确定select2字段的焦点，但是它需要额外的按键来显示search字段，并允许inputsearchstring。

因此，如果你加载页面并开始键入：“search”，“S”将打开search框，然后其余的键将被input到它，所以你会search“earch”

Answer 1

根据select2文档：

 $('#id').select2('open'); 

应该是所有你需要的。

在文档的程序访问部分下find。

Answer 2

这在版本3.4.2中起作用。 不知道什么时候它被完全实现。

 $('#id').select2('focus'); 

Answer 3

Select2创build自己的input，所以尝试这样的事情：

 $(window).load(function(){ $('#id').prev('.select2-container').find('.select2-input').focus(); }); 

Answer 4

如果你使用：

 $('#id').select2('open'); 

select2被打开，你可以直接键入search。

如果你使用：

 $('#id').select2('open').select2('close'); 

焦点被设置为创build的select2下拉列表。 如果在键盘上按下Enter或Ctrl + Arrow down ，可以将其打开。

个人认为这比：

 $('#id').select2('focus'); 

因为你不能用键盘真的打开select2下拉列表。

Answer 5

这对我来说是有效的，它也将闪烁的光标放在input栏中。 订单很重要！

 $('#s2id').select2('focus'); $('#s2id').select2('open'); 

Answer 6

我试了其他2个答案，但没有太多的运气，也许是因为我通过JSON填充控件，并在一开始它只是一个隐藏的input，所以程序化的开放方法没有任何影响。

不过，下面对我来说就好了：

 $(document).ready(function() { $('#s2id_autogen1').focus(); }); 

如果由于某种原因，您没有相同的ID出现在您的设置中，然后查找附加了select2-focusser类的控件。

Answer 7

我们有一个文本框为select2，并使用下面的代码片段来激活和聚焦文本input中的光标。 所有其他选项并不适用于我们，因为它们只是打开select2选项，但没有产生预期的行为。

 $('#s2id_autogen1').click() $('#s2id_autogen1').focus() 

Answer 8

在Select2 4.0上，方法.select2（'focus'）什么都不做。 然而，我的解决方法是简单地通过“aria-labelledby”属性获取“span”元素（注意值是基于id的，所以它是独特的），并将其集中：

 var $field = $('select'); $field.select2(); var id = $field.attr('id'); var $spanLabel = $field.next().find("span[aria-labelledby='select2-" + id + "-container']"); $spanLabel.focus(); 

Answer 9

Dan-Nolan已经很好地回答了，但是对于那些对于Select2来说是新手的人来说，有一点需要注意：在调用它的函数之前，html对象需要用select2初始化：

所以最终的代码应该是

 $('#id').select2(); $('#id').select2('open'); 

Answer 10

在Select2 4.0.2我有一个问题与select2（'焦点'）。 列表看起来像集中，但是当我按ENTER键不打开。
对我来说就是解决scheme。

 $('#id').select2(); $('.select2-selection', $('#id').next()).focus(); or $('#id').next().find('.select2-selection').focus(); 

Answer 11

根据select2文档：

 $('document').ready(function(){ var opencustomer = $("#changedatachange").select2(); opencustomer.select2("open"); }); 

Answer 12

使用此后缀：

 $('#id').select2('open'); $('#id').select2('close');