如何在 select 选项标签的占位符末尾添加内容

Question

I'm trying to add some content (ie, text or icon) to the end of the <option> tag placeholder but I'm not quite sure how to do this.我正在尝试将一些内容（即文本或图标）添加到<option>标记占位符的末尾，但我不太确定如何执行此操作。 I want to be clear that I am not talking about appending content after whatever is in the placeholder but instead at the end of the placeholder.我想明确一点，我不是在谈论在占位符中的任何内容之后附加内容，而是在占位符的末尾。

For example, imagine the option tag in the browser shows a certain size, ie whatever is in the between the square brackets shown below:例如，假设浏览器中的选项标签显示一定的大小，即如下方括号之间的任何内容：

I'm not trying to append content after the default option as shown below,我不是想 append 内容后默认选项如下图，

[default option "some_extra_content"                ]

but instead I'm hoping to achieve something like:但相反，我希望实现以下目标：

[default option                 "some_extra_content"]

Is there a way I can do this?有没有办法我可以做到这一点？ I've been searching for a long time but I haven't seen anything that is helpful.我已经搜索了很长时间，但我没有看到任何有用的东西。 All I've got so far is shown below but it's just a normal <select>到目前为止，我所拥有的一切如下所示，但这只是一个普通的<select>

<select>
    <option selected="selected" value="">Select your option "some_extra_content"</option>
    <option value="a">A</option>
    <option value="b">B</option>
</select>

Answer 1

option HTML element: Permitted content Text, possibly with escaped characters (like é).选项 HTML 元素：允许的内容文本，可能带有转义字符（如 é）。

You can try to pad the middle with (non breaking spaces)您可以尝试用（非中断空格）填充中间

 <html> <head> <style></style> </head> <body> <select id="select1"> <option id="option0" selected="selected" value=""> Select your option &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;"some_extra_content" </option> <option id="option1" value="a"> A &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp; More TEXT </option> <option id="option2" value="b"> B &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp; Bees knees </option> </select> <script></script> </body> </html>

如何在 select 选项标签的占位符末尾添加内容

问题描述

1 个解决方案

解决方案1
0 2022-01-31 21:45:40

如何在 select 选项标签的占位符末尾添加内容

问题描述

1 个解决方案

解决方案1 0 2022-01-31 21:45:40

解决方案1
0 2022-01-31 21:45:40