如何关闭禁用下拉开启？

Question

  <div id=ControlId>
       <select id="' +ControlId + '_text" value="Select Options" style="max-width:150px;background:White;Width:150px"> <option selected>Select Options</option></select>
  </div>
  <div id=ControlId + "_child"  style="display: none" > 
      <table>
         <tr>
            <td valign="top" style="width: 165px" ><input type="checkbox" name="vehicle" value="Bike" /> option 1
            </td>
         </tr>
         <tr>
            <td valign="top" style="width: 165px" ><input type="checkbox" name="vehicle" value="Car" /> option 2
            </td>
         </tr>
         <tr>
            <td valign="top" style="width: 165px" ><input type="checkbox" name="vehicle" value="dog" /> option 3
            </td>
         </tr>
    </table>
   </div>

我创建了多个选择的下拉列表，如下所示，如何禁用默认下拉列表

这是我在JQuery中的实际事件：

$("#" + ControlId).click(function () {
       $("#" + ControlId + "_child").fadeIn("slow");
       $("#" + ControlId + "_child").toggle();
});

如何禁用默认下拉列表开头？

Answer 1

我不确定您是否正在尝试停用下拉列表。如果是这样，请尝试使用以下代码禁用它。

$("#" + ControlId + "_text").attr("disabled", true);

同时检查您的HTML代码，必须清理它。

EDIT1：如果您使用的是jQuery 1.6+，请尝试使用prop;

$("#" + ControlId + "_text").prop("disabled", true);

EDIT2：点击下拉列表时隐藏到选项。

$("#" + ControlId).click(function () {
$("#" + ControlId + " options").hide();
});

<击> EDIT3 ：您正在尝试使用 占位符进行SELECT标记 ，目前它不可用。  删除内联样式以进行选择，并将以下css添加到代码中。

select {
    max-width:150px;
    background:White;        
    height: 25px;
}
/* Hidden placeholder */
 select option[disabled]:first-child {
    display: none;
}

在Firefox中查看此JSFiddle。