使用javascript突出显示选择选项_Javascript

使用javascript突出显示选择选项

javascript

使用javascript突出显示选择选项,javascript,Javascript,我有一个组列表，如下所示： <select id="groups"> <option value="g1">G1</option> <option value="g2">G2</option> <option value="g3">G3</option> </select> 当用户选中Casper的复选框并单击Edit按钮时，应在组列表中突出显示（选中）G1-G2和G3。当我在联系人列表中获得g

我有一个组列表，如下所示：

<select id="groups">

<option value="g1">G1</option>
<option value="g2">G2</option>
<option value="g3">G3</option>

</select>

当用户选中

Casper

的

复选框

并单击

Edit

按钮时，应在组列表中突出显示（选中）G1-G2和G3。当我在联系人列表中获得group字段的值时，所有三个组都带有逗号

“G1-G2-G3”

。非常感谢你的帮助。

谢谢，

您可以让编辑按钮将所选属性指定给选项，然后使用css设置样式

option[selected] { background: #f00; }

您可以让“编辑”按钮将所选属性指定给选项，然后使用css设置样式

option[selected] { background: #f00; }

一些提示，我相信自己解决这个问题对你有好处；）

似乎
```
Casper
```
属于多个组，因此您应该将
```
multiple=“true”
```
设置为您的
```
select
```
当您选中
```
Casper
```
时，检索与他相关的组数据，例如
```
[“g1”、“g2”、“g3”]
```
。循环此列表，并将每个选项的值设置为选中的
如果您想支持IE6，还需要在
```
selected
```
选项中添加一个类，比如
```
selected
```
CSS规则
```
{option.selected:background:yellow}
```
将起作用
如果您只针对现代浏览器，
```
选项[selected]{xxx}
```
运行良好

似乎
```
Casper
```
属于多个组，因此您应该将
```
multiple=“true”
```
设置为您的
```
select
```
当您选中
```
Casper
```
时，检索与他相关的组数据，例如
```
[“g1”、“g2”、“g3”]
```
。循环此列表，并将每个选项的值设置为选中的
如果您想支持IE6，还需要在
```
selected
```
选项中添加一个类，比如
```
selected
```
CSS规则
```
{option.selected:background:yellow}
```
将起作用
如果您只针对现代浏览器，
```
选项[selected]{xxx}
```
运行良好

Casper

function(groupstring) {
// groupstring is something like "G1-G2"

    var groups = groupstring.split("-");
    var options = document.getElementById("groups").options;
    for (var i=0; i<options.length; i++) {
        var opt = options[i];
        opt.defaultSelected = groups.indexOf(opt.value) > -1;
    }
}

函数（groupstring）{
//groupstring类似于“G1-G2”
var groups=groupstring.split（“-”）；
var options=document.getElementById（“组”）.options；
对于（var i=0；i-1；
}
}

selected

defaultSelected

multiple

Casper

function(groupstring) {
// groupstring is something like "G1-G2"

    var groups = groupstring.split("-");
    var options = document.getElementById("groups").options;
    for (var i=0; i<options.length; i++) {
        var opt = options[i];
        opt.defaultSelected = groups.indexOf(opt.value) > -1;
    }
}

函数（groupstring）{
//groupstring类似于“G1-G2”
var groups=groupstring.split（“-”）；
var options=document.getElementById（“组”）.options；
对于（var i=0；i-1；
}
}

selected

defaultSelected

multiple

“G1-G2-G3”作为文本，仅带有逗号.toLowerCase（）.split（“-”）以获取该列表。感谢您的回答，但当我选择Casper并单击编辑按钮时，我将使用“”G1-G2-G3”将“G1-G2-G3”作为仅带逗号的文本。toLowerCase（）.split（“-”）以获取该列表。