javascript - JQuery 只在数组中设置一次值

Question

我遇到了一个小问题。我从隐藏字段中获取一个值，将其拆分为一个数组，并将该数组设置为 <select> 的选定选项

我检查了日志，js 正确地拆分了数组，但由于某种原因它只选择了第一个。

例如:

Only one option selected

HTML

<select id="relationship" multiple="multiple" name="com.Relationship" style="display:block;">
    <option value="ActiveParish">Active Parish Committee Member</option>
    <option value="AdminStaff">Administration/Staff</option>
    <option value="CommMember">Committee Member</option>
    <option value="Corporation">Corporation</option>
    <option value="Festival">Festival Committee</option>
    <option value="Friend">Friend</option>
    <option value="Music">Music Program</option>
    <option value="NewlyReg">Newly Registered</option>
    <option value="NotReg">Not Registered</option>
    <option value="Volunteer">Volunteer</option>
    <option value="Other">Other</option>
</select>

 <input id="relationshipstrings" name="com.RelationshipStrings" type="hidden" value="AdminStaff, CommMember, Corporation">

这是我的 Javascript

var data = document.getElementById('relationshipstrings').value

var arraydata = data.split(',');

console.log(arraydata)

$("#relationship").val(arraydata);

只是为了验证，这是控制台中的输出:)

Array(3)
0:"AdminStaff"
1:" CommMember"
2:" Corporation"
length:3
__proto__:Array(0)

---

有什么想法吗？我让它工作了一瞬间，但我不知道我做了什么让它停止工作..

Answer 1

您需要 trim 数组项，在设置变量后添加此行:

arraydata = arraydata.map(item => item.trim());

所以现在整个js是:

var data = document.getElementById('relationshipstrings').value
var arraydata = data.split(',');
arraydata = arraydata.map(item => item.trim()); // trim
console.log(arraydata);
$("#relationship").val(arraydata);

或者正如@Rory McCrossan 所建议的那样，简单地说:

var arraydata = data.split(', ');