javascript - 并排显示选择框中的两个选项

Question

我一直在尝试在列表中显示一个带有两个选项的选择框。事实证明这很困难，我似乎找不到任何提供此功能的库。例如:

<select>

<option x><option y>
<option x><option y>
<option x><option y>
<option x><option y>
<option x><option y>

</select>

你可以看到这个工作的例子 here (抱歉，我不能做一个 jsfiddle，因为显然我不能让它工作!)与“右眼 PWR:”下拉列表。

我曾尝试根据其内容按样式移动选项，即以 50% 的宽度向左浮动并向右浮动，但我不太幸运(尤其是跨浏览器，这不是一个很好的选择这样做的方式)。非常感谢有关解决此问题的最佳方法的任何建议。先感谢您。

Answer 1

要做到这一点，您需要能够下载 this jquery 库。它使您能够按列对选择下拉菜单进行排序。通过将此添加到您的网站:

    <script type="text/javascript">

                    $(document).ready(function() {
                        $('#selector').gentleSelect(); // apply gentleSelect with default options
                    });

    </script>

添加后，通过使用他们的自述文件，您可以选择一定数量的列显示在您的选择框中。

您可以通过添加一些自定义代码来更改功能(就像在我的问题中将它们与正面和负面并排放置)。

You can see a Js Bin here