javascript - 选择一个选项后取消突出显示下拉菜单

Question

我有一个下拉菜单

<select id='getbusornew'>
    <option value='News'>BBC News</option>
    <option value='Business'>Business News</option>
</select>

它附加了 css :

.NBSCustomDropDownParent select {
    text-indent: 1px;
    width: 244px;
    -webkit-appearance: none;
    -moz-appearance: none;
    margin-bottom : 5px;
    border: none;
    background: transparent url("/Style%20Library/NBSImages/NBSCustomDropDownArrow.png") no-repeat 205px center;
    font-family: NBS;
    font-size: 2.3em;
    color: rgb(0, 41, 121);
}

.NBSCustomDropDownParent select option {
    color: rgb(0, 41, 121);
    font-family: NBS;
    font-size: 2.3em;
}

但是我有一个问题，一旦我从下拉列表中选择了一个选项并且下拉列表消失只显示我选择的选项，它会一直突出显示直到我点击离开。有没有办法改变它自动突出显示

Answer 1

最简单的方法是通过一些 JavaScript

$('#getbusornew').on('change', function () {
    $(this).blur();
});

这会在您选择一个选项时将焦点从元素上移开。

JSFiddle example