html下拉框组件怎么做,如何使用html创建一个可添加的下拉列表，类似于我们在jira中添加组件时使用的内容？...

匿名用户

这需要一些样式，您将需要更改某些元素的选择方式，但这是基本的JavaScript概念:

nullconst menuItems = [

"qwert",

"scdfvgbh",

"cdrdh",

"sdsrg",

"sgfbrynhybgdfv",

"847ht4r"

];

//selects the div

const container = document.getElementsByTagName("div")[0];

menuItems.forEach(name => {

const element = document.createElement("p");

element.innerHTML = name;

container.appendChild(element);

});

//selects the input

const input = document.getElementsByTagName("input")[0];

input.addEventListener("keyup", function() {

//selects every element in the div

const elements = container.children;

//loop through dropdown options

for (let i = 0, l = elements.length; i < l; i++) {

//checks if the value of the input is contained in the dropdown option

if (elements[i].innerHTML.includes(input.value)) {

elements[i].style.display = "block";

} else {

elements[i].style.display = "none";

}

}

});input {

width: 150px;

}

div {

width: 156px;

border: 1px solid #000000;

}

div>p {

position: relative;

}