Javascript optgroup 隐藏不工作 IExplorer

Question

此代码在 Opera 中有效，问题出在 IE 和 Android。使用 hiden() javascript。 First Option use value Mazda (mark) 第二个向我们展示 'opera': 只有所有型号的 MAZDA (是好的)。 'IE'：向我们展示所有模型和所有 optgroup。可能是 JS 的问题？

$(document).ready(function() {
  $('#model optgroup').hide();enter code here
  $('#Marka').change(function() {
    var text = $(this).val();
    $('#model optgroup').hide();
    $('#model').val('');
    $('#model optgroup[label="' + text + '"]').css({
      'display': 'block'
    });


  });
});

function usun() {
  document.getElementById("first").style.display = "none";

}

https://jsfiddle.net/p051m5u6/

Answer 1

你的HTML(jsfiddle)中有一些错误：请注意不同的ID使用不同的值。不能存在两个或多个具有相同 ID 的元素。

我建议你的解决方案是保存和删除文档准备好的选项组，然后根据选择附加正确的选项：

var optGroup = {};
$(function () {
  // remove from second list all optgroup and save them in a global variable
  $('#model optgroup').each(function(index, element) {
    optGroup[element.label] = {'optGroup': element};
    $('#model optgroup:eq(0)').remove();
  });

  $('#Marka').change(function(){
    // remove the attached optgroup
    $('#model optgroup').remove();
    // search for the saved optgroup and attach it to the select
    $(optGroup[this.value].optGroup).appendTo('#model');
    $('#model optgroup option:selected').removeAttr("selected");
    $('#first2').prop('selected', true);
  });
});

<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>

<select id="Marka" name="marka_auta">
    <option id="first1" >Marka:</option>
    <optgroup label="Marka Auta:">
        <option value="audi" >Audi</option>
        <option value="mazda" >Mazda</option>
    </optgroup>
</select>
<select id="model" name="model_auta">
    <option id="first2" disabled selected>Model:</option>
    <optgroup id="models1" label="mazda">
        <option>RX-8</option>
        <option>323F</option>
        <option>6</option>
    </optgroup>

    <optgroup id="models2" label="audi">
        <option>A6</option>
        <option>R8</option>
        <option>A4</option>
    </optgroup>
</select>

Javascript optgroup 隐藏不工作 IExplorer

Javascript optgroup hidden dont working IExlorer

javascript

jquery

internet-explorer

option

optgroup