javascript - 如何自动选择蓝色而不是灰色的<选项>

标签 javascript jquery html

我正在尝试一个简单的网站功能,其中包含一个带有一些选项的选择。我想允许仅使用键盘数字进行选择,但在我正在(Internet Explorer Mobile)上尝试此功能的系统中,如果不至少单击选项,我就无法做到这一点。

代码如下:

<body>
    Press a key to select an option

    <select id="choose" size="7">
        <option value="1">Volvo</option>
        <option value="2">Saab</option>
        <option value="3">Opel</option>
        <option value="4">Audi</option>
        <option value="5">Citroen</option>
    </select>

    <script type="text/javascript">
        $(document).ready(function() {
            $("#choose").prop("selectedIndex", 3); 
            $(document).keydown(function(e) {   
                if (e.which > 48 && e.which < 54) {
                    $("#choose").val(e.which - 49);
                }if (e.keyCode > 48 && e.keyCode < 54) {
                    $("#choose").val(e.keyCode - 49);
                }
            });
        });             
    </script>
</body>

它适用于 Chrome,但我注意到页面加载时所选选项上有奇怪的灰色背景
Grey selection
而不是普通的蓝色,点击后出现
blue selection

不幸的是,Internet Explorer Mobile 似乎无法识别灰色选项背景,而单击它后(从而将背景从灰色更改为蓝色),“键盘选择”工作正常。

如何在页面加载后立即将选项背景设置为蓝色?

最佳答案

使用.focus():

$("#choose").prop("selectedIndex", 3).focus();

或者简单地设置如下值:

$("#choose").val(3).focus();

关于javascript - 如何自动选择蓝色而不是灰色的<选项>,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33365569/

相关文章:

javascript - 组合百分比+像素div布局

javascript - 我有一个 javascript 对象,我想通过 id 查找用户并更新他们的余额

php - 服务器时间问题

javascript - 我们如何在谷歌地图中添加带有点击事件的多个标记?

html - 具有 CSS opacity 属性的 <video> 仅在 Chrome 54 for Mac 上显得异常暗淡

html - 带有水平子菜单的 CSS 下拉菜单

javascript - 为什么Firefox插件中的console.log无法输出消息?

javascript - 如何在 Element 和 Infinity 之间获得 if 语句?

javascript - 滚动时 jQuery 淡出 - 我做错了什么?

javascript - 如何根据用户输入生成修改后的超链接列表