HTML多列选择列表

Question

通常会创建html列表，

<select size=6 name="sel" id="sel">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="4">5</option>
    <option value="4">6</option>
    <option value="4">7</option>
    <option value="4">8</option>
    <option value="4">9</option>
</select>

但它显示为，

1
2
3
4
5

相反，我想成为，

1   2   3   4
5   6   7   8
9   .........

或

1   3   5   7
2   4   6   8

如何在不使用任何“插件”和“jquery”等的情况下显示它。 只想用纯javascript，html，css方式做

.........

Answer 1

使用<select>输入无法做到这一点。试试这样的事情，让你开始：http://jsfiddle.net/spryno724/z67w9/5/

<ul>
  <li>
    <ul>
      <li>1</li>
      <li>2</li>
    </ul>
  </li>

  <li>
    <ul>
      <li class="selected">3</li>
      <li>4</li>
    </ul>
  </li>
</ul>

Answer 2

无法修改选择选项的样式，它是系统控制。你应该用css和html绘制一些东西（或者像你建议的那样使用像jquery这样的库）

Answer 3

您不能以这种方式设置选择样式。您必须创建自定义窗口小部件，或使用三个常规选择并在后端合并结果。