javascript - jquery 附加下拉选项禁用 ="disabled"

Question

在我的正常 html 下拉菜单中，我使用以下代码将默认选定选项设置为禁用状态

<select id="sel_bank" name="sel_bak">
  <option disabled="disabled" SELECTED >Select Your product</option>
  <option>Mobile</option>
  <option>laptop</option>
</select>

我有一个或多个下拉菜单，其中选项的填充取决于第一个下拉菜单的选择。

<select id="sel_state" name="sel_state">
  <option disabled="disabled" SELECTED >Select Your brand</option>
</select>

并使用下面的jquery:

 $(document).ready(function() {
  $("#sel_bank").change(function() {
  var el = $(this) ;
   if(el.val() === "Mobile" ) {
     $("#sel_state").empty().append
     ("<option SELECTED>Select Your product</option>\
       <option>Samsung</option>\
       <option>Nokia</option>");
     }
   else if(el.val() === "laptop"){
     $("#sel_state").empty().append
          ("<option SELECTED>Select Your product</option>\
            <option>HP</option>\
            <option>Dell</option>");       
      }
  });   
});

在这里，我还需要将默认选择的选项选择您的产品设置为禁用，与第一个类似。我尝试将

("<option disabled="disabled"  SELECTED>Select Your product</option>\
  <option>HP</option>\
  <option>Dell</option>");

但这不起作用。怎么做？

<强> FS FIDDLE SETUP

Answer 1

JSFIDDLE DEMO

您正在清空然后再次追加。但您没有添加disabled选项

     $("#sel_bank").change(function () {
         var el = $(this);
         if (el.val() === "Mobile") {
             $("#sel_state").empty().append("<option disabled='disabled' SELECTED>Select Your product</option>\
     <option>Samsung</option>\
<option>Nokia</option>");
         } else if (el.val() === "laptop") {
             $("#sel_state").empty().append

             ("<option disabled='disabled' SELECTED>Select Your product</option>\
     <option>HP</option>\
<option>Dell</option>");

         }
     });