0
  <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();
});

如何禁用默认下拉打开?

4

1 回答 1

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 tag 设置占位符,目前它不可用。删除用于选择的内联样式并将以下 css 添加到您的代码中。

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

在 Firefox 中查看这个JSFiddle

于 2013-06-17T07:07:39.317 回答