Question

我有一个dropdownmenu

<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

Answer 2

使用这一行JQuery应用于所有DropDowns：

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

<强> Check JSFiddle Demo

选择选项后取消选中下拉菜单

2 个答案: