自定义选择框的 tabindex 问题答案

【问题标题】：tabindex issue with custom select box自定义选择框的 tabindex 问题
【发布时间】：2014-09-26 20:20:21
【问题描述】：

我从谷歌找到了这个脚本。但它不适用于 tabindex。你能帮我解决这个问题吗？

这里是jsfiddle链接

js 片段：-

$('select').each(function () {

    // Cache the number of options
    var $this = $(this),
        numberOfOptions = $(this).children('option').length;

    // Hides the select element
    $this.addClass('s-hidden');

    // Wrap the select element in a div
    $this.wrap('<div class="select"></div>');

    // Insert a styled div to sit over the top of the hidden select element
    $this.after('<div class="styledSelect"></div>');

    // Cache the styled div
    var $styledSelect = $this.next('div.styledSelect');

    // Show the first select option in the styled div
    $styledSelect.text($this.children('option').eq(0).text());

    // Insert an unordered list after the styled div and also cache the list
    var $list = $('<ul />', {
        'class': 'options'
    }).insertAfter($styledSelect);

【问题讨论】：

请您说出您想要达到的目标。你没有提到任何地方
此选择框不适用于 tabindex。
您的标签代码在哪里。所以我们可以帮助你
他的意思是新的选择框不能通过键盘访问。那些事件不存在。我只看到 click 事件正在处理。另外，即使在选择框与键盘一起使用之前，它也需要在那里聚焦。
只是和需要做的事情的例子...不是一个完整的修复..但在这里..jsfiddle.net/BB3JK/334

标签： javascript jquery jquery-selectbox

【解决方案1】：

需要用jQuery动态设置tabindex。

//Adds tabindex dynamically 
$this.attr("tabindex", "0");

http://jsfiddle.net/elitownsend/BB3JK/4733/

【讨论】：