识别多选框中的唯一值答案

【问题标题】：Identifying Unique Values in Multi Select box识别多选框中的唯一值
【发布时间】：2014-03-27 10:28:36
【问题描述】：

我遇到了需要您的专业知识来解决问题的情况。

我有三个多选文本框，即Roles、Database 和RolesAssignedOnDatabase。

角色选择框具有值：Read, Write, DBAdmin, UserAdmin。数据库选择框具有值：ABC,XYZ 等。 RolesAssignedOnDatabase 选择框为空。

现在用户必须从角色选择框中选择一个值，然后从数据库选择框中选择一个值，最后单击添加按钮，这将在第三个多选框（RolesAssignedOnDatabase）中添加一个字符串模式，如Roles@Database (for eg: read@ABC, read@XYZ)。

现在我遇到的问题是，如果选择相同的值，用户会在添加按钮上单击两次，然后第三个选择框会得到重复的值，例如

 read@ABC,read@ABC,read@XYZ.

如何在不循环比较每个值的情况下识别 javascript 多选框中的重复字符串值？

（P.S 我没有足够的声望来粘贴 UI 的图片）。

【问题讨论】：

【解决方案1】：

你可以使用jQuery的.find()：

if($("#multi-select-wrapper").find(":contains('" + value + "')").length == 0) {
    ... // Add the element here.
}

或者，如果您更喜欢纯 javascript，您可以使用此 hack 创建选项值：

<option class="read@abc" value="read@abc">read@abc</option>

那么你可以使用：

var temp = document.getElementsByClassName(value)
if(temp.length == 0) {
    ... // Add the element here.
}

不建议这样做，因为 class 不是选项的有效 html 属性，尽管它适用于大多数浏览器（希望如此）：Fiddle

【讨论】：