如何使用javascript从select2输入的多个选定值中获取文本答案

【问题标题】：how to get text from multiple selected values of select2 input using javascript如何使用javascript从select2输入的多个选定值中获取文本
【发布时间】：2017-03-02 14:44:14
【问题描述】：

我将 select2 用于我的输入选择并设置多个为真。就我而言，我尝试使用 javascript 函数从多个选定值中获取文本数组。

这是我的 javascript 和 html 输入：

<script type="text/javascript">
   function getRoles(val) {
         $('#role-cm_role_text').val('');
         var data = $('#role-cm_role').select2('data')[0].text;
         $('#role-cm_role_text').val(data);
         $('#role-cm_role').on('select2:unselecting', function (e) {
            $('#role-cm_role_text').val('');
        });
    }
</script>

<select id="role-cm_role" class="form-control" name="Role[CM_ROLE][]" multiple size="4" onchange="getRoles(this.value)" style="display:none">
<option value="INQUIRY">CM Inquiry</option>
<option value="SUPERVISOR">CM Supervisor</option>

<input type="hidden" id="role-cm_role_text" class="form-control" name="Role[CM_ROLE_TEXT]">

所以如果我尝试选择一个值，CM_ROLE_TEXT 的结果与CM_ROLE 相同。但是如果我尝试选择多个值，CM_ROLE_TEXT 的结果只是得到CM_ROLE 的第一个值。

如果尝试选择多个值的结果：

[CM_ROLE] => Array
        (
            [0] => INQUIRY
            [1] => SUPERVISOR
        )

[CM_ROLE_TEXT] => CM Inquiry // I need the result of CM_ROLE_TEXT is same with the result of CM_ROLE

谁能帮我解决我的问题？谢谢

【问题讨论】：

标签： javascript html select2

【解决方案1】：

据我所知，问题出在这行

var data = $('#role-cm_role').select2('data')[0].text;

因为您只选择了数组的第一个[0]。所以这确实是预期的行为。因此，要获取数组中的所有结果文本，您也许可以这样做

var data = $('#role-cm_role').select2('data').map(function(elem){ 
                return elem.text 
           });

那么您将拥有一个包含所有选定字符串的数组。在此处阅读 map 函数：https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/map

这是一个活生生的例子：https://jsbin.com/qujocujuko/edit?html,js,output

【讨论】：