jquery - 如何显示很长的选择选项的所有文本？

Question

我有一些很长<option> s 在 <select>盒子，但我不希望盒子这么宽。问题是当我将框设置为较小时无法阅读全文。我正在考虑将文本的副本恰好悬停在鼠标指针悬停的选项上，但前提是文本太长而无法完全显示。

但是，如果我创建一个新元素，比如 <p>对于 jQuery，它没有宽度，直到我将它插入到文档中，所以我无法决定是否插入它。

即使我确实成功创建了它，我也不确定所有样式是否都相同。

有没有办法让这个想法发挥作用，或者有没有更好的方法来显示长 <option> 的完整文本？到位了吗？

Answer 1

这个呢？

<select id="muchtextselect">
  <option value="" title="This is some long text text This is some long text text This is some long text text ">This is some long text text This is some long text text This is some long text text </option>
  <option value="">Short Text</option>
  <option value="" title="This is some really, really long text">This is some really, really long text</option>
</select>

js

var maxLength = 15;
$('#muchtextselect > option').text(function(i, c) {
  if (c.length > maxLength) {
    return c.substr(0, maxLength) + '...';  
  }
});

WORKING DEMO