Question

我正在尝试使select2框在页面加载时出现在聚焦状态。我尝试过以下方法：

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

只有第一行似乎有任何效果，它确实关注了select2字段，但它需要一个额外的按键来显示搜索字段，并允许输入搜索字符串。

因此，如果您加载页面并开始输入：“搜索”，“S”将打开搜索框，然后其余的键将输入其中，因此您将搜索“earch”< / p>

Answer 1

根据Select2文档：

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

应该是你所需要的一切。

在documentation。

的程序化访问部分下找到

Answer 2

这适用于3.4.2版。不确定它何时完全实现。

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

Answer 3

Select2创建自己的输入，所以尝试这样的事情：

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

Answer 4

如果您使用：

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

打开select2，您可以直接键入进行搜索。

如果您使用：

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

焦点设置为创建的select2下拉列表。如果您点击键盘上的Enter或Ctrl + Arrow down，则可以将其打开。

个人认为这比以下更好：

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

因为您无法使用键盘真正打开select2下拉列表。

Answer 5

这对我有用，它还将闪烁的光标放在输入字段中。订单很重要！

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

Answer 6

我尝试了其他2个答案，但没有太多运气，也许是因为我通过json填充控件并且在开始时它只是一个隐藏的输入所以编程打开方法没有任何影响。

然而，以下对我来说没问题：

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

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

Answer 7

我们有一个文本字段为select2 ，并使用以下代码段激活并将光标聚焦在文本输入中。所有其他选项对我们都没有用，因为他们只打开了select2选项，但没有产生预期的行为。

＆＃13;

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

＆＃13;

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（'focus'）的问题。列表看起来像焦点，但当我按ENTER键不打开。
对我而言，这就是解决方案。

$('#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');

select2强制关注页面加载

12 个答案: