例如,我在選擇輸入中有 3 個選項:我可以選擇水果、家具或電影。
當我選擇其中一個時,表格需要顯示在下面。
對于每一種選擇,都需要有不同的形式。
任何人都可以幫助我,如何使它作業?
我知道如何創建表單和所有內容,但我不知道當 select 的值發生更改時如何更改它們。
我正在做一個使用 HTML、CSS、JS 和 PHP 的專案。
uj5u.com熱心網友回復:
function myFunction(val) {
document.getElementById('frutas').style.display = "none";
document.getElementById('moveis').style.display = "none";
document.getElementById('filmes').style.display = "none";
document.getElementById(val).style.display = "block";
}
<form action="">
<select name="" id="" onchange="myFunction(this.value)">
<option value="">--selection--</option>
<option value="frutas">Frutas</option>
<option value="moveis">Móveis</option>
<option value="filmes">Filmes</option>
</select>
</form>
<div>
<div id="frutas" style="display: none;">
Você escolheu frutas
</div>
<div id="moveis" style="display: none;">
Você escolheu moveis
</div>
<div id="filmes" style="display: none;">
Você escolheu filmes
</div>
</div>
我希望我幫助了你
uj5u.com熱心網友回復:
function myFunction(val) {
if(val==""){
document.getElementById("dynamic_part").innerHTML="<p>Please pick up any thing!!</p>";
return;
}
const obj = {
frutas : "<label>Fruit stuff</label><input type='text' value='Input the fruit things'><br><label>Fruit stuff</label><input type='text' value='Input the fruit things'>",
moveis: "<label>Movie stuff</label><input type='text' value='Input the movie things'>",
filmes: "<label>Films stuff</label><input type='text' value='Input the films things'><br><label>Films stuff</label><input type='text' value='Input the films things'>"
};
document.getElementById("dynamic_part").innerHTML=obj[val];
}
input,select{
height:40px;
margin:10px;
}
<form action="">
Select something
<select name="" id="" onchange="myFunction(this.value)">
<option value="">--selection--</option>
<option value="frutas">Frutas</option>
<option value="moveis">Móveis</option>
<option value="filmes">Filmes</option>
</select>
<div id="dynamic_part">
<p>Please pick up any thing!!</p>
</div>
</form>
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/425179.html
標籤:javascript php html 形式
上一篇:如何停止表單提交?
