gpt4 book ai didi

javascript - 使用 javascript 和 html 使字段出现/消失

转载 作者:行者123 更新时间:2023-12-03 12:36:36 25 4
gpt4 key购买 nike

我正在创建一些单选按钮,当我单击其中一个按钮时,会出现一些字段。我的问题是,当我单击下一个按钮时,上一个按钮中的字段仍保留在屏幕上,而我需要它们消失。这是我写的代码,我知道我失败的原因是它从未在我的javascript函数中输入else语句。有人可以帮助我,我是这两种语言的菜鸟,有没有办法保留发送到函数的先前值,以便我可以与 else 语句进行比较?任何其他解决方案也将受到好评!

<HTML>
<HEAD> <title> Ticket Choice </title></HEAD>
<BODY>
<FORM>
<SCRIPT type="text/javascript">
function IsCheck(but_Check, if_Check){
if (document.getElementById(but_Check).checked) {
document.getElementById(if_Check).style.display = 'block';
}
else document.getElementById(if_Check).style.display = 'none';
}
</SCRIPT>

<input type = "radio" onclick = "javascript:IsCheck(&quot;buttonCheck1&quot;,&quot;ifChecked1&quot;);" name = "plane" id = "buttonCheck1"> PLANE <br>
<div id = "ifChecked1" style="display:none">
<label for = "depart">Departure:</label>
<input type = "text" id = "depart" name = "depart_plane" maxlength = "200"><br>
<label for = "dest">Destination:</label>
<input type = "text" id = "dest" name = "destination_plane" maxlength = "200"><br>
</div>

<input type = "radio" onclick = "javascript:IsCheck(&quot;buttonCheck2&quot;,&quot;ifChecked2&quot;);" name = "plane" id = "buttonCheck2"> SHIP <br>
<div id = "ifChecked2" style="display:none">
<label for = "depart">Departure:</label>
<input type = "text" id = "depart" name = "depart_ship" maxlength = "200"><br>
<label for = "dest">Destination:</label>
<input type = "text" id = "dest" name = "destination_ship" maxlength = "200"><br>
</div>

<input type = "radio" onclick = "javascript:IsCheck(&quot;buttonCheck3&quot;,&quot;ifChecked3&quot;);" name = "plane" id = "buttonCheck3"> O.S.E <br>
<div id = "ifChecked3" style="display:none">
<label for = "depart">Departure:</label>
<input type = "text" id = "depart" name = "depart_ose" maxlength = "200"><br>
<label for = "dest">Destination:</label>
<input type = "text" id = "dest" name = "destination_ose" maxlength = "200"><br>
</div>
</FORM>
</BODY>
</HTML>

最佳答案

该条件永远不会进入 else 语句,因为您总是点击一个单选按钮,它就会被检查。

相反,试试这个:

<input type = "radio" onclick = "IsCheck(1);" name = "plane" id = "buttonCheck1"> PLANE <br>
<div id = "ifChecked1" style="display:none">
<label for = "depart">Departure:</label>
<input type = "text" id = "depart" name = "depart_plane" maxlength = "200"><br>
<label for = "dest">Destination:</label>
<input type = "text" id = "dest" name = "destination_plane" maxlength = "200"><br>
</div>
<input type = "radio" onclick = "IsCheck(2);" name = "plane" id = "buttonCheck2"> SHIP <br>
<div id = "ifChecked2" style="display:none">
<label for = "depart">Departure:</label>
<input type = "text" id = "depart" name = "depart_ship" maxlength = "200"><br>
<label for = "dest">Destination:</label>
<input type = "text" id = "dest" name = "destination_ship" maxlength = "200"><br>
</div>
<input type = "radio" onclick = "IsCheck(3);" name = "plane" id = "buttonCheck3"> O.S.E <br>
<div id = "ifChecked3" style="display:none">
<label for = "depart">Departure:</label>
<input type = "text" id = "depart" name = "depart_ose" maxlength = "200"><br>
<label for = "dest">Destination:</label>
<input type = "text" id = "dest" name = "destination_ose" maxlength = "200"><br>
</div>

JavaScript:

function IsCheck(number){
//here we iterate the three divs
for(i = 1; i <= 3; i++){
//if the current number (i) is different to the checked input (number)
if (i != number) {
document.getElementById('ifChecked'+i).style.display = 'none';
}
else {
document.getElementById('ifChecked'+i).style.display = 'block';
}
}}

关于javascript - 使用 javascript 和 html 使字段出现/消失,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23710688/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com