jQuery - 无法在最后一个optgroup上选择第一个选项

Question

我有小问题.我需要选择选项<select>A,由此引发的行动和选择他第一个<option>在<select>由所选择的B值<option>从A.一切工作正常,但我不能选择只持续OPTGROUP和他的选项.

试着看看jsfiddle

这个bug似乎只适用于Firefox(Linux,Win7).谷歌浏览器还可以.有任何想法吗？

代码(html):

<select id="charset" name="charset">
    <option value=""></option>
    <option value="armscii8">ARMSCII-8 Armenian</option>
    <option value="ascii">US ASCII</option>
    <option selected="selected" value="utf8">UTF-8 Unicode</option>
</select>

<select id="collation" name="collation">
    <optgroup label="armscii8">
        <option value="armscii8_bin">armscii8_bin</option>
        <option value="armscii8_general_ci">armscii8_general_ci</option>
    </optgroup>
    <optgroup label="ascii">
        <option value="ascii_bin">ascii_bin</option>
        <option value="ascii_general_ci">ascii_general_ci</option>
    </optgroup>
    <optgroup label="utf8">
        <option value="utf8_bin" selected="selected">utf8_bin</option>
        <option value="utf8_czech_ci">utf8_czech_ci</option>
        <option value="utf8_danish_ci">utf8_danish_ci</option>
        <option value="utf8_esperanto_ci">utf8_esperanto_ci</option>
    </optgroup>
</select>`

代码js:

(function($){

function setCollation(charset) {
    $('#collation optgroup option').removeAttr('selected');
    $('#collation optgroup').hide(0);

    if (charset && charset != '') {
        $("#collation optgroup[label='" + charset + "']").show(0);
        $("#collation optgroup[label='" + charset + "'] option:first").attr('selected', 'selected');
    }
}

$('#charset').change(function() {
    setCollation($(this).val());
});
setCollation($('#charset').val());

})(jQuery);

---

UPDATE

我更新了jsfiddle,我删除了显示/隐藏功能.

我将尝试重现脚本的工作原理:

1. 当我从第一个选择框(fe.value DOS Russin)中选择Collat​​ion时,会根据需要选择第二个选择.

2. 我将第一个选择值更改为另一个.在这一刻,一切都好.

3. !我改回了DOS俄语,在这一刻,第二步没有选择第二个选择框.

这是一个非常奇怪的行为,我不能在FF中工作.

Answer 1

好吧，我无法解释为什么浏览器行为不一致，但我可以告诉你，更改似乎.prop已经解决了问题。

 $('#collation optgroup').prop('disabled', true);
    $('#collation option').removeAttr('selected');

    if (charset && charset != '') {
        $("#collation optgroup[label='" + charset + "']").prop('disabled',false);
        $("#collation optgroup[label='" + charset + "'] > option:eq(0)").prop('selected', true);

看看它的实际效果：

http://jsfiddle.net/8pAAp/1/