我正在一个项目中,根据用户的选择,我希望在页面上具有两种不同的形式。 如果其中一个窗体处于活动状态,则另一个窗体将被隐藏。 我也希望两者都发布到另一个页面。
目前,这是我的解决方案:
<script type="text/javascript">
function showHide() {
var div = document.getElementById("CSGO_");
if (div.style.display == 'none') {
div.style.display = '';
}
else {
div.style.display = 'none';
}
}
</script>
<script type="text/javascript">
function showHide1() {
var div = document.getElementById("LOL");
if (div.style.display == 'none') {
div.style.display = '';
}
else {
div.style.display = 'none';
}
}
</script>
这是我用来隐藏/显示表单的两个脚本。 用户可以在此处选择要填写的内容-(我宁愿有一个下拉菜单之类的东西)
<table width="200" border="0">
<tr>
<td><form onsubmit="showHide(); return false;"><input type="submit" name="CSGO" value="Counter Strike"></form></td>
<td> <form onsubmit="showHide1(); return false;"><input type="submit" name="LOL" value="League of Legends"></form></td>
</tr>
</table>
这些是隐藏的表格div
<div id="CSGO_" style="display: none;">
<form name="reg2" action="confirm_reg2.php" method="post" >
<input type="text">
</form>
</div>
<div id="LOL" style="display: none;">
<form name="reg2" action="confirm_reg2.php" method="post" >
<input type="text" value="league!">
</form>
</div>
我正在寻找更好的解决方案,因为这感觉很笨拙。