Question

我正在select下拉列表中寻找分隔线，例如：

<select name="season" class="season">
    <option value="">Select season</option>
    {% for season in search_item.get_seasons %}
        <option value="{{ season }}">{{ season }}</option>
    {% endfor %}
    <option>---------------------------</option>
    <option value="-1">I need to create a new season for this item</option>
</select>

是否可以使用最长选项的宽度创建一个值？例如，我希望--------除法器在其中具有最长值的（大约）宽度。有办法吗？

Answer 1

是的，假设您不介意行中的某些“间隔”，这是有可能的。

考虑到您已经拥有search_item.get_seasons，可以在每个season上运行.length，以找出最长的.length，方法是循环遍历每个变量并覆盖一个变量（如果当前项目具有一个<select>更长。在这里，您可以简单地将相关-的{{3}}设置为等于.length乘以该变量（现在包含最长项的const items = [ "A season", "A really, really long season", "Short season" ]; let longest = 0; for (let i = 0; i < items.length; i++) { if (items[i].length > longest) { longest = items[i].length; } } const element = document.querySelector('.line'); element.innerHTML = "-".repeat(longest);）。我已经使用.innerHTML进行了介绍。

请注意，您将希望使用等宽字体（例如Courier）以获得最佳效果。

这可以在下面看到：

select {
  font-family: Courier;
}

<select name="season" class="season">
  <option value="">Select season</option>
  <option value="">A season</option>
  <option value="">A really, really long season</option>
  <option value="">Short season</option>
  <option class="line"></option>
  <option value="-1">I need to create a new season for this item</option>
</select>

paste(sort(unlist(strsplit(x = "beetle_bee",split = "_"))),collapse="_")
#[1] "bee_beetle"

下拉占位符分隔符

1 个答案: