根据另一个下拉菜单中的答案创建显示的下拉菜单,可以通过使用JavaScript和AJAX技术实现。具体步骤如下:
<option value="option1">选项1</option>
<option value="option2">选项2</option>
<option value="option3">选项3</option>
</select>
<option value="">请选择</option>
</select>
const menu1 = document.getElementById('menu1');
const menu2 = document.getElementById('menu2');
menu1.addEventListener('change', function() {
const selectedOption = menu1.value;
const xhr = new XMLHttpRequest();
xhr.open('GET', `https://example.com/api/menu2?option=${selectedOption}`);
xhr.onload = function() {
if (xhr.status === 200) {
const response = JSON.parse(xhr.responseText);
menu2.innerHTML = '';
response.forEach(function(item) {
const option = document.createElement('option');
option.value = item.value;
option.textContent = item.label;
menu2.appendChild(option);
});
menu2.style.display = 'block';
}
};
xhr.send();
});
const express = require('express');
const app = express();
app.get('/api/menu2', function(req, res) {
const option = req.query.option;
const menu2Options = getMenu2Options(option);
res.json(menu2Options);
});
function getMenu2Options(option) {
// 根据option参数返回相应的选项
// 示例:如果option为option1,则返回选项1的下拉菜单选项
// 示例:如果option为option2,则返回选项2的下拉菜单选项
// 示例:如果option为option3,则返回选项3的下拉菜单选项
}
app.listen(3000, function() {
console.log('Server started on port 3000');
});
通过以上步骤,可以实现根据第一个下拉菜单中的选项创建显示的下拉菜单。
领取专属 10元无门槛券
手把手带您无忧上云