Javascript html 选择选项

Question

我有一个选择下拉框，显示一个选项高于1时的文本。

我有许多相同的下拉框，但代码仅适用于第一个

感谢您的回复，是的，我使用 span 而不是 div 来解决文本位置问题。

唯一剩下的就是结果，我遇到的问题是它是 php 文件的一部分，该文件会自动生成一个订单列表，如何在自动生成时使每个字段都是唯一的，因此该函数会影响它们而不是第一个.

这是代码

 function dropdownTip(value) { console.log(value); document.getElementById("result").innerHTML = value; }

 <label for="letters">Amount Of Letters In Order:</label> &nbsp; <select onChange="dropdownTip(this.value)" name="search_type" style="margin-right:10px; margin-top:2px;"> <option selected="selected" value="1">1</option> <option value="More then One Letter">2</option> <option value="More then One Letter">3</option> <option value="More then One Letter">4</option> <option value="More then One Letter">5</option> <option value="More then One Letter">6</option> <option value="More then One Letter">7</option> <option value="More then One Letter">8</option> <option value="More then One Letter">9</option> <option value="More then One Letter">10</option> </select> <span id="result"></span>

image1 Image2任何帮助将不胜感激。

Answer 1

您可以用 div 包装它并添加以下类：

display:flex;

 function dropdownTip(value) { console.log(value); document.getElementById("result").innerHTML = value; }

 .section { display: flex; }

 <div class="section"> <label for="letters">Amount Of Letters In Order:</label> &nbsp; <select onChange="dropdownTip(this.value)" name="search_type" style="margin-right:10px; margin-top:2px;"> <option selected="selected" value="1">1</option> <option value="More then One Letter">2</option> <option value="More then One Letter">3</option> <option value="More then One Letter">4</option> <option value="More then One Letter">5</option> <option value="More then One Letter">6</option> <option value="More then One Letter">7</option> <option value="More then One Letter">8</option> <option value="More then One Letter">9</option> <option value="More then One Letter">10</option> </select> <div id="result"></div> </div>