jquery多选（ctrl点击）到多选（单击）答案

【问题标题】：Jquery multiple select (ctrl click) to multiple select (single click)jquery多选（ctrl点击）到多选（单击）
【发布时间】：2013-07-11 08:29:25
【问题描述】：

我一直在网上四处寻找，但似乎无法找到我所提出问题的直接答案。

我有一个这样的多下拉菜单：

<form action="form_action.asp">
<select name="cars" id="mySelect" multiple>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
<input type="submit">
</form>

现在众所周知，您可以使用 ctrl+click 来选择此列表中的多个项目。

我想将其更改为单击一次。

我尝试了一些方法：

在单击时模拟 ctrl（这可能是最糟糕的想法我这周吃过）。
更改选定的属性。然而，这得到了选择（它的视觉部分至少）当你点击下一个撤消项目。

我不想使用任何插件，除非没有其他干净的方法可以这样做。

【问题讨论】：

你可以使用一个 jquery 插件来为你做这个。看看这个：jquery4u.com/plugins/10-jquery-selectboxdrop-down-plugins
你能不能只保留一个array 变量。因此，每次单击option 时，都会将option 添加到array 中，再次单击时会将其从array 中删除。单击后，循环遍历array，并将selected 属性设置为array 中的所有options。
这是一个选项 putvande。即使如果它会那么复杂，只使用插件似乎更合乎逻辑。我将经常使用它，所以我真的需要一个可靠的解决方案。此外，数组工作的视觉部分将是一个巨大的 *** ;-)。

标签： jquery multi-select

【解决方案1】：

普通表格

  <select multiple size="5">
    <option value="Cat">Cat</option>
    <option value="Frog">Frog</option> 
    <option value="Dog">Dog</option>
    <option value="Monkey">Monkey</option> 
    <option value="Parrot">Parrot</option> 
  </select>

你可以使用

<script>
window.onmousedown = function (e) {
    var el = e.target;
    if (el.tagName.toLowerCase() == 'option' && el.parentNode.hasAttribute('multiple')) {
        e.preventDefault();

        // toggle selection
        if (el.hasAttribute('selected')) el.removeAttribute('selected');
        else el.setAttribute('selected', '');

        // hack to correct buggy behavior
        var select = el.parentNode.cloneNode(true);
        el.parentNode.parentNode.replaceChild(select, el.parentNode);
    }
}
</script>

工作示例：https://output.jsbin.com/caxacaz

【讨论】：

OP 正在寻找一种能够选择多个选项而无需单击 Ctrl 的解决方案
不相关。感谢您投入时间。