单击后，蓝色突出显示选择输入中的选项文本

Question

我有一个简单的表单，其中包含一些选项，当选项被更改时需要执行操作（创建新的表单元素）。这一切都运行正常，但是当选择了一个选项并且用户点击页面上的其他位置（另一个表单选项或页面的空白区域）时，所选选项的文本仍然以蓝色突出显示。

之前我使用过select而没有遇到此问题，但是它们没有链接到.change函数。这与为什么会发生这件事情有关吗？以前有人遇到过这个问题吗？所有帮助非常感谢！代码如下......

<div id="container1" class="form-group">
    <label class="control-label">Select an option</label>
    <div>
        <select class="form-control" id="mySelect">
            <optgroup label="A">
                <option value="1A">Option1A</option>
                <option value="2A">Option2A</option>
                <option value="3A">Option3A</option>
                <option value="4A">Option4A</option>
            </optgroup>
            <optgroup label="B">
                <option value="1B">Option1B</option>
                <option value="2B">Option2B</option>
                <option value="3B">Option3B</option>
                <option value="4B">Option4B</option>
            </optgroup>
        </select>
    </div>
</div>

我已经看到了这里提出的问题

Remove Blue highlighting of option

但是我不认为这完全描述了我的问题，因为在我看来，那个人想在使用表格时删除蓝色突出显示（尽管很难100％确定）。我不介意在使用表单时蓝色突出显示，我只是希望它在停止使用表单并在页面上执行其他操作时停止持久化。

更新：问题似乎只出现在Internet Explorer（测试版本9,10和11）中。在Chrome中测试并且不会发生问题。只是详细说明一下这个问题，这个问题与JS无关（所以我删除了JQuery代码和后续的标签）。在选择表单中使用optgroup时会出现此问题。将上面列出的HTML加载到IE中会产生错误。