Question

我创建了一个看起来像这样的下拉列表：

Item1
     Item2
     Item3
Item4
     Item5
     Item6
     Item7

我想将Item1和Item4作为不可选择的项目。这可能与Jquery有关吗？
LaterEdit：我应该可以通过名为fooheader的类选择item1和item4（事件）其余的可选项由fooDetails类调用。

目前，我的临时修复使得Dll中的下一个值成为所选值，但我正在寻找更优雅的解决方案

Answer 1

您应该使用<optgroup> ...

<select>
  <optgroup label="Item 1">
    <option>Item 2</option>
    <option>Item 3</option>
  </optgroup>
  <optgroup label="Item 4">
    <option>Item 5</option>
    <option>Item 6</option>
    <option>Item 7</option>
  </optgroup>
</select>

这是一个jsFiddle ......

http://jsfiddle.net/DKLwv/

如果您不希望它们嵌套，请按照这样做......

<select>
  <optgroup label="Item 1"></optgroup>
  <option>Item 2</option>
  <option>Item 3</option>
  <optgroup label="Item 4"></optgroup>
  <option>Item 5</option>
  <option>Item 6</option>
  <option>Item 7</option>
</select>

Answer 2

试试这个

 <select>
<option value="" disabled>---------------------</option>

</select>

Answer 3

嗯..我已经完成了这一部分..我在修改我的DDL时遇到了一些问题，将选项放在我的下拉列表中的几个字段中。这是我的解决方案，也许它可以帮助其他人（并在此过程中给我一些额外的赞成票：P）

 var $groups = $("#ddlId").filter(function () {
        return $(this).css('color') == 'rgb(0, 0, 0)'; // your condition of finding the optgroup elements 
    });
    $groups.each(function () {
        var $this = $(this);
        $this.nextUntil($groups).wrapAll($("<optgroup>", {
            label: $this.text()
        })).end().remove();
    });

Dropdownlist中的值不可选

3 个答案: