单击一个单选按钮时更改布局形式
[英]change layout form when i click one radio button
问题描述
Hello I am a student and recently I am learning JavaScript, CSS, and HTML and in making an exercise I have a problem.
您好，我是一名学生，最近我正在学习 JavaScript、CSS 和 HTML，在做练习时我遇到了问题。
In exercise, I'm using Bootstrap.在练习中，我使用的是 Bootstrap。
function Form(stringa){ document.getElementById("form1").style.display="none"; document.getElementById("form2").style.display = "none"; document.getElementById(stringa).style.display = "block"; }
<;doctype html> <html lang="en"> <head> <title>Form di registrazione</title> </head> <body> <div class="container"> <h1>Form di Registrazione</h1> <div class="form-check form-check-inline"> <input class="form-check-input" type="radio" name="inlineRadioOptions" value=1 onclick="Form('form1');" > <label class="form-check-label" for="inlineRadio1">Privato</label> </div> <div class="form-check form-check-inline"> <input class="form-check-input" type="radio" name="inlineRadioOptions" onclick="Form('form2'): " value=2> <label class="form-check-label" for="inlineRadio2">Azienda</label> </div> <form id="form1" class="row g-3" value=1> <div class="col-md-6"> <label for="inputEmail4" class="form-label">Email</label> <input type="email" class="form-control" id="inputEmail4"> </div> <div class="col-md-6"> <label for="inputPassword4" class="form-label">Password</label> <input type="password" class="form-control" id="inputPassword4"> </div> </form> <form id="form2" type="hidden"class="row g-3"style="display;none;" value=2> <div class="col-md-6"> <label for="inputEmail4" class="form-label">Eeeeee</label> <input type="email" class="form-control" id="inputEmail4"> </div> </form> </div> </body> </html>
Why when I click on the radio button it changes the form layout?为什么当我单击单选按钮时它会更改表单布局？
Thank you, everyone谢谢大家
1 个解决方案
解决方案1
0 2020-12-24 14:25:26
You'll already have 2 different forms.您已经拥有 2 个不同的 forms。 On click at radio input (which placed outside the forms? what?) will run function with toggle forms display.单击无线电输入（位于 forms 之外？什么？）将运行 function 并切换 forms 显示。
What's happened: Hiding one of form and showing another one with different numbers of inputs.发生了什么：隐藏一种形式并显示具有不同输入数量的另一种形式。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.