时间戳

首页 > 解决方案 > html中的动态下拉

javascript - html中的动态下拉

问题描述

我必须制作一个 html 页面，其中应该有 TextBox 和一个添加按钮，如果用户通过 Textbox 添加一些东西，那么它应该在 Dropdown 中可见。

请帮助代码。

提前致谢。

标签： javascriptformsdropdown

解决方案

我不确定您需要什么，但根据您的描述，我能够构建这个基本页面：

const list = document.getElementById("lists");
const text = document.getElementById("myText");
function addEntry(){
  var newOption = document.createElement("OPTION");
  newOption.value = text.value;
  newOption.innerHTML = text.value;
  list.appendChild(newOption);
  text.value = "";
  text.focus();
}
<select id="lists">
<option selected disabled>-- SELECT ONE --</option>
</select>
<br><br>
<input type="text" id="myText" placeholder="Type here...">
<input type="button" onclick="addEntry()" value="+ ADD">

基本上，它使用一个函数来获取值，创建一个 HTML<option>元素，然后将其插入到下拉菜单中。

推荐阅读