首页 > 解决方案 > 从多选输入中迭代选定的值

问题描述

我想遍历多个选择框中的选定值并根据字符串检查它们,一旦找不到匹配项就返回 false。首先我试过:

var exampleString = "example";
var mySelections = $("#mySelect option:selected");
for (selection in mySelections) {
    if (exampleString.indexOf(mySelections[selection].text()) === -1) {
        return false; 
    };
};

但是,此代码给了我一个错误:“文本不是函数”。我明白这是因为使用索引获取选项对象本身,而不是包装在 jQuery 中,并且提供 text() 方法的是 jQuery。

我尝试了使用 each 函数的替代版本:

var result = $("#mySelect option:selected").each(function () {
    if (exampleString.indexOf($( this ).text()) === -1) {
        return false;
    }
});

但是,我不明白我得到的结果。我天真地假设我的变量结果将设置为 false 或 true,但它似乎只是返回正在迭代的对象。除了在函数内部创建一个设置为 true 或 false 的全局变量之外,还有什么方法可以访问这些字符串比较的结果?

编辑添加:根据要求,这是相关的html:

<select multiple="" class="filterSelect" id="mySelect" style="display: none;">
    <option value="A">A</option>
    <option value="B">B</option>
    <option value="C">C</option>
</select>

标签: javascriptjquery

解决方案


这就是我要做的(我不再是 jQuery 用户):

let testStr = "dd";

document.getElementById('sel').addEventListener('change', (e) => {
  const values = []
  for (let i=0; i<e.target.selectedOptions.length; i++) {
    values.push(e.target.selectedOptions[i].value);
  }
  console.log(!values.includes(testStr));
  return !values.includes(testStr);
})
<select id="sel" multiple>
  <option value="aa">aa</option>
  <option value="bb">bb</option>
  <option value="cc">cc</option>
  <option value="dd">dd</option>
  <option value="ee">ee</option>
</select>


推荐阅读