Html选择问题

Question

我在html select元素中有一些长文本。 当用户选择一个选项时，只要选择是，就会显示文本。

什么是使其可用且清晰的最佳解决方案？

实施例

<select>
<option>very long text 1</option>
<option>very long text 2</option>
<option>very long text 3</option>
</select>

由于选择元素长度，用户将看到类似“非常长的t”的内容。 是否有jquery脚本或一些技巧可以使整个文本可见？

Answer 1

我通常截断显示值（使用...后缀），这样它就不会搞砸下拉列表，然后我将实际的长值设置为选项title： -

<select>
    <option value="1" title="the brown fox jumped over the fence">the brown fox...</option>
    ...
</select>

Answer 2

一种选择是用一组单选按钮/标签替换<select>。您可以使用更多选项来格式化文本，并且阅读起来会更容易。

或者，如果不需要在选择框中包含所有文本，则可以缩短选项上的文本 - 可以使用javascript填充页面上的其他区域，并详细说明他们刚刚选择的选项。

编辑 - 要延长{​​{1}}框，您可以使用<select>或您需要的任何宽度设置其CSS宽度。 （或者显然把风格放在一个类中）