使用JavaScript显示或隐藏基于文本框的下拉列表可以通过以下步骤实现:
<input type="text" id="textbox">
<select id="dropdown">
<option value="option1">Option 1</option>
<option value="option2">Option 2</option>
<option value="option3">Option 3</option>
</select>
var textbox = document.getElementById("textbox");
var dropdown = document.getElementById("dropdown");
textbox.addEventListener("input", function() {
if (textbox.value === "") {
dropdown.style.display = "none"; // 隐藏下拉列表
} else {
dropdown.style.display = "block"; // 显示下拉列表
}
});
#dropdown {
display: none; /* 默认隐藏下拉列表 */
}
这样,当文本框的值为空时,下拉列表将被隐藏起来;当文本框的值不为空时,下拉列表将被显示出来。
腾讯云相关产品和产品介绍链接地址:
领取专属 10元无门槛券
手把手带您无忧上云