Php 按顺序选择选项
我想知道你是否能帮我解决一个问题，我在实现我的企业的网站。 正如您在我的代码中所看到的，我已经创建了6个选择选项，但是我想确保第二个选择选项（然后是第三个等）只有在我在第一个选择选项上输入值时才会出现，我现在不知道如何做。 这是我的密码：Php 按顺序选择选项,php,html,jquery,Php,Html,Jquery,我想知道你是否能帮我解决一个问题，我在实现我的企业的网站。 正如您在我的代码中所看到的，我已经创建了6个选择选项，但是我想确保第二个选择选项（然后是第三个等）只有在我在第一个选择选项上输入值时才会出现，我现在不知道如何做。 这是我的密码： <div class="case-item"> <div class="container"> <h2 class="t
<div class="case-item">
<div class="container">
<h2 class="title title--h3">I tuoi canotti</h2>
<br>
<div class="row">
<div class="col-md-4">
<div class="row">
<div class="col-md">
<select name="users" id="canotto1" onchange="Canotto(this.value,'Canotto1');">
<?php echo $opt->Canotti(); ?>
</select>
</div>
<div class="col-md-1">
<a
style="
background-color: #cc0000;
border-radius: 10px;
border: 0;
color: #fff;
cursor: pointer;
font-size: 0.8rem;
font-weight: 400;
line-height: inherit;
text-transform:uppercase;
overflow: hidden;
padding: 0.4rem 0.6rem;
position: relative;
transition: .4s ease-in-out;
white-space: nowrap;
z-index: 1;"
onclick="EliminaCanotto('Canotto1');">Elimina</a>
</div>
</div>
<br>
<div id="mostra2">
<div class="row">
<div class="col-md">
<select name="users" id="canotto2" onchange="Canotto(this.value,'Canotto2');">
<?php echo $opt->Canotti(); ?>
</select>
</div>
<div class="col-md-1">
<a
style="
background-color: #cc0000;
border-radius: 10px;
border: 0;
color: #fff;
cursor: pointer;
font-size: 0.8rem;
font-weight: 400;
line-height: inherit;
text-transform:uppercase;
overflow: hidden;
padding: 0.4rem 0.6rem;
position: relative;
transition: .4s ease-in-out;
white-space: nowrap;
z-index: 1;"
onclick="EliminaCanotto('Canotto2');">Elimina</a>
</div>
</div>
</div>
<br>
<div class="row">
<div class="col-md">
<select name="users" id="canotto3" onchange="Canotto(this.value,'Canotto3');">
<?php echo $opt->Canotti(); ?>
</select>
</div>
<div class="col-md-1">
<a
style="
background-color: #cc0000;
border-radius: 10px;
border: 0;
color: #fff;
cursor: pointer;
font-size: 0.8rem;
font-weight: 400;
line-height: inherit;
text-transform:uppercase;
overflow: hidden;
padding: 0.4rem 0.6rem;
position: relative;
transition: .4s ease-in-out;
white-space: nowrap;
z-index: 1;"
onclick="EliminaCanotto('Canotto3');">Elimina</a>
</div>
</div>
<br>
<div class="row">
<div class="col-md">
<select name="canotto1" id="canotto4" onchange="Canotto(this.value,'Canotto4');">
<?php echo $opt->Canotti(); ?>
</select>
</div>
<div class="col-md-1">
<a
style="
background-color: #cc0000;
border-radius: 10px;
border: 0;
color: #fff;
cursor: pointer;
font-size: 0.8rem;
font-weight: 400;
line-height: inherit;
text-transform:uppercase;
overflow: hidden;
padding: 0.4rem 0.6rem;
position: relative;
transition: .4s ease-in-out;
white-space: nowrap;
z-index: 1;"
onclick="EliminaCanotto('Canotto4');">Elimina</a>
</div>
</div>
<br>
<div class="row">
<div class="col-md">
<select name="canotto5" id="canotto5" onchange="Canotto(this.value,'Canotto5');">
<?php echo $opt->Canotti(); ?>
</select>
</div>
<div class="col-md-1">
<a
style="
background-color: #cc0000;
border-radius: 10px;
border: 0;
color: #fff;
cursor: pointer;
font-size: 0.8rem;
font-weight: 400;
line-height: inherit;
text-transform:uppercase;
overflow: hidden;
padding: 0.4rem 0.6rem;
position: relative;
transition: .4s ease-in-out;
white-space: nowrap;
z-index: 1;"
onclick="EliminaCanotto('Canotto5');">Elimina</a>
</div>
</div>
<br>
<div class="row">
<div class="col-md">
<select name="canotto6" id="canotto6" onchange="Canotto(this.value,'Canotto6');">
<?php echo $opt->Canotti(); ?>
</select>
</div>
<div class="col-md-1">
<a
style="
background-color: #cc0000;
border-radius: 10px;
border: 0;
color: #fff;
cursor: pointer;
font-size: 0.8rem;
font-weight: 400;
line-height: inherit;
text-transform:uppercase;
overflow: hidden;
padding: 0.4rem 0.6rem;
position: relative;
transition: .4s ease-in-out;
white-space: nowrap;
z-index: 1;"
onclick="EliminaCanotto('Canotto6');">Elimina</a>
</div>
</div>
</div>
<div class="col-sm-1">
</div>
<div class="col-md-7">
<div id="txtHint"></div>
</div>
</div>
</div>
</div>
我是卡诺蒂
伊莱米娜
伊莱米娜
伊莱米娜
伊莱米娜
伊莱米娜
伊莱米娜
function Canotto（str，can）{if（str==”）{document.getElementById（“txtHint”）.innerHTML=“”；return；}else{var id=；var xmlhttp=new XMLHttpRequest（）；xmlhttp.onreadystatechange=function（）{if（this.readyState==4&&this.status==200）{document.getElementById（“txtHint”）.innerHTML=this.responseText；}；xmlhttp.open（“GET”），“Plenum_inserimentoCanotti.php？q=“+str+”&id=“+id+”&can=“+can，true）；xmlhttp.send（）；}}Canotto选择数据集数据id同级选择器findnextselectfindpreviousselectdocument.addEventListener（'DOMContentLoaded'，（）=>{
让col=document.queryselectoral（'select.canotto'）；
const findnextselect=（n，expr）=>{
设s=n.nextElementSibling；
而{
如果（s.matches（expr））返回s；
如果（s.tagName.toLowerCase（）='body'）返回false；
s=s.nextElementSibling；
}
}
const findpreviousselect=（n，expr）=>{
设s=n.previousElementSibling；
而{
如果（s.matches（expr））返回s；
如果（s.tagName.toLowerCase（）='body'）返回false；
s=s.previousElementSibling；
}
}
常量changehandler=函数（e）{
设i=Number（this.dataset.id）；
设n=findnextselect（这是'select.canotto'）；
设p=findpreviousselect（这是'select.canotto'）；
如果（n&&Number（n.dataset.id）>=i）n.classList.add（'active'）；
};
列forEach（sel=>{
sel.addEventListener（'change'，changehandler）
})
})select.canotto{display:none；padding:0.5rem；margin:0.5rem}
select.canotto:第一个子项{display:block}
.active{显示：阻止！重要}
1.
2.
3.
4.
5.
6.
7.
8.
9
1.
2.
3.
4.
5.
6.
7.
8.
9
1.
2.
3.
4.
5.
6.
7.
8.
9
1.
2.
3.
4.
5.
6.
7.
8.
9
<!DOCTYPE html>
<html>
<head>
<title>Hide Show</title>
</head>
<body>
<style>
#style-select { background-color: #cc0000;
border-radius: 10px;
border: 0;
color: #fff;
cursor: pointer;
font-size: 0.8rem;
font-weight: 400;
line-height: inherit;
text-transform:uppercase;
overflow: hidden;
padding: 0.4rem 0.6rem;
position: relative;
transition: .4s ease-in-out;
white-space: nowrap;
z-index: 1; }
</style>
<div class="case-item">
<div class="container">
<h2 class="title title--h3">I tuoi canotti</h2>
<br>
<div class="row">
<div class="col-md-4">
<div class="row">
<div class="col-md">
<select name="users" id="canotto1">
<?php echo $opt->Canotti(); ?>
</select>
</div>
<div class="col-md-1">
<a id="style-select"
onclick="hideShowFeature()">Elimina</a>
</div>
</div>
<br>
<div id="mostra2">
<div class="row">
<div class="col-md">
<select name="users" id="canotto2">
<?php echo $opt->Canotti(); ?>
</select>
</div>
<div class="col-md-1">
<a id="style-select"
onclick="hideShowFeature2()">Elimina</a>
</div>
</div>
</div>
<br>
<div class="row" id="mostra3">
<div class="col-md">
<select name="users" id="canotto3">
<?php echo $opt->Canotti(); ?>
</select>
</div>
<div class="col-md-1">
<a id="style-select"
onclick="hideShowFeature3()">Elimina</a>
</div>
</div>
<br>
<div class="row" id="mostra4">
<div class="col-md">
<select name="canotto1" id="canotto4" onchange="Canotto(this.value,'Canotto4');">
<?php echo $opt->Canotti(); ?>
</select>
</div>
<div class="col-md-1" >
<a id="style-select"
onclick="hideShowFeature4()">Elimina</a>
</div>
</div>
<br>
<div class="row" id="mostra5">
<div class="col-md">
<select name="canotto5" id="canotto5" onchange="Canotto(this.value,'Canotto5');">
<?php echo $opt->Canotti(); ?>
</select>
</div>
<div class="col-md-1">
<a id="style-select"
onclick="hideShowFeature5()">Elimina</a>
</div>
</div>
<br>
<div class="row " id="mostra6">
<div class="col-md">
<select name="canotto6" id="canotto6" onchange="Canotto(this.value,'Canotto6');">
<?php echo $opt->Canotti(); ?>
</select>
</div>
<div class="col-md-1">
<a id="style-select"
>Elimina</a>
</div>
</div>
</div>
<div class="col-sm-1">
</div>
<div class="col-md-7">
<div id="txtHint"></div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
function hideShowFeature() {
if (document.getElementById("canotto1").checked = true) {
document.getElementById("mostra2").style.display = "block";
document.getElementById("mostra3").style.display = "none";
document.getElementById("mostra4").style.display = "none";
document.getElementById("mostra5").style.display = "none";
document.getElementById("mostra6").style.display = "none";
}
}
function hideShowFeature2() {
if (document.getElementById("canotto2").checked = true) {
document.getElementById("mostra2").style.display = "block";
document.getElementById("mostra3").style.display = "block";
document.getElementById("mostra4").style.display = "none";
document.getElementById("mostra5").style.display = "none";
document.getElementById("mostra6").style.display = "none";
}
}
function hideShowFeature3() {
if (document.getElementById("canotto3").checked = true) {
document.getElementById("mostra2").style.display = "block";
document.getElementById("mostra3").style.display = "block";
document.getElementById("mostra4").style.display = "block";
document.getElementById("mostra5").style.display = "none";
document.getElementById("mostra6").style.display = "none";
}
}
function hideShowFeature4() {
if (document.getElementById("canotto4").checked = true) {
document.getElementById("mostra2").style.display = "block";
document.getElementById("mostra3").style.display = "block";
document.getElementById("mostra4").style.display = "block";
document.getElementById("mostra5").style.display = "block";
document.getElementById("mostra6").style.display = "none";
}
}
function hideShowFeature5() {
if (document.getElementById("canotto5").checked = true) {
document.getElementById("mostra2").style.display = "block";
document.getElementById("mostra3").style.display = "block";
document.getElementById("mostra4").style.display = "block";
document.getElementById("mostra5").style.display = "block";
document.getElementById("mostra6").style.display = "block";
}
}
</script>
<style>
#mostra2 {
display:none;
}
#mostra3 {
display:none;
}
#mostra4 {
display:none;
}
#mostra5 {
display:none;
}
#mostra6 {
display:none;
}
</style>
</body>
</html>
隐藏秀
#样式选择{背景色：#cc0000；
边界半径：10px；
边界：0；
颜色：#fff；
光标：指针；
字体大小：0.8rem；
字体大小：400；
行高：继承；
文本转换：大写；