Question

我有一个像这样选择的组列表：

<select id="groups">

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

</select>

我有一个基本上包含以下内容的联系人列表：

Name = group
============
Casper  G1-G2-G3
Andy    G1-G2
Mark    G2-G3

当用户选中checkbox Casper并点击Edit按钮时，应在组列表中突出显示G1-G2 and G3（已选中）。当我在联系人列表中获取组字段的值时，所有三个组都带有逗号"G1-G2-G3"。非常感谢您的帮助。谢谢，

Answer 1

您可以使编辑按钮将所选属性分配给选项，然后使用css为其设置样式。

option[selected] { background: #f00; }

Answer 2

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

似乎Casper属于多个群组，因此您应将multiple="true"设置为select
检查Casper时，检索与他关联的群组数据，说["g1", "g2", "g3"]。循环遍历此列表，并将每个选项的值设置为selected。
如果您想支持IE6，还需要在selected选项中添加一个类selected。
CSS规则{ option.selected: background: yellow}可以解决问题。
如果您只定位于现代浏览器，option[selected]{ xxx }效果很好。

Answer 3

好的，所以我想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;
    }
}

我不确定您是否要使用selected或defaultSelected属性。请注意，您的选择应将multiple设置为true（<select id="groups" multiple>）。

使用javascript突出显示选择选项

3 个答案: