带有“N”列的jQuery“选择多个”

Posted 2023-03-05

【中文标题】带有“N”列的jQuery“选择多个”

【英文标题】：jQuery 'Select Multiple' with 'N' Columns

【发布时间】：2016-09-22 05:02:05

【问题描述】：

我正在处理一个项目，它有一个列表框（标签：选择多个），它应该有多个列。

其实那个 ListBox 是一个真正的 ListBox，但它必须像一个带有列的 Table 一样显示（tag: table）。

示例（如果是这样）：

<select multiple>
    <option> <tr> <t> Hello </td> <td> World </td> <td> ! </td> </tr </option>
    ...
</select>

_____________________________________
|  Hello   |     World     |   !  | |
'''''''''''''''''''''''''''''''''''''
|  Hello   |     World     |   !  | |
'''''''''''''''''''''''''''''''''''''
|  Hello   |     World     |   !  | |
'''''''''''''''''''''''''''''''''''''
|  Hello   |     World     |   !  | |
'''''''''''''''''''''''''''''''''''''
|  Hello   |     World     |   !  | |
'''''''''''''''''''''''''''''''''''''

有没有办法做这样的事情？

【参考方案1】：

如果你使用固定宽度的字体，它只是一个正确布局的情况。 html 中没有官方的列表框/列表选择。

select 
  font-family: "Andale Mono", "Monotype.com", monospace;

<select multiple>
  <option>| Hello&nbsp;&nbsp;&nbsp; | World | ! |</option>
  <option>| Goodbye&nbsp; | World | ! |</option>
</select>

【参考方案2】：

您可以像这样使用tab 字符（	）：

<select multiple>
  <option>Hello &#9; Hello &#9; Hello</option>
  <option>Hello &#9; Hello &#9; Hello</option>
</select>