问题遇到的现象和发生背景
便民服务费,关联{name :"1001",desc :"燃气费"},{name :"1001",desc :"水费"},{name :"1002",desc :"电费"},
政府服务费 ,关联{name :"1005",desc :"税费"},{name :"1006",desc :"五险一金"}
便民服务费,关联{name :"1001",desc :"燃气费"},{name :"1001",desc :"水费"},{name :"1002",desc :"电费"},
政府服务费 ,关联{name :"1005",desc :"税费"},{name :"1006",desc :"五险一金"}
PJF 不太懂,以jQuery的形式给你完成了
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<form action="#" method="post">
<select name="mmc1" id="mmc1">
<option value="0">请选择</option>
</select>
<select name="mmc2" id="mmc2">
<option value="0">请选择</option>
</select>
</form>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
let parentList = [
{
name: "1",
desc: "便民服务费",
},
{
name: "2",
desc: "政府服务费",
},
];
let childObj = {
1: [
{ name: "1001", desc: "燃气费" },
{ name: "1001", desc: "水费" },
{ name: "1002", desc: "电费" },
],
2: [
{ name: "1005", desc: "税费" },
{ name: "1006", desc: "五险一金" },
],
};
parentList.forEach(function (item) {
$("#mmc1").append(`<option value="${item.name}">${item.desc}</option>`);
});
$("#mmc1").change(function (e) {
const value = e.target.value;
$("#mmc2 option").remove();
childObj[value].forEach(function (item) {
$("#mmc2").append(
`<option value="${item.name}">${item.desc}</option>`
);
});
});
</script>
</body>
</html>