将表单文本框和按钮放在每个单选按钮前面

Question

在窗口加载时，仅显示单选按钮和标签。仅点击单选按钮，想要将textboxes和buttons放在每个单选按钮前面。例如。 Email me(lable)-textbox-email button-validation error在一行中。在代码中，它低于我不想要的每个标签。我不知道该怎么做。任何人都可以告诉我该怎么做...提前谢谢。

window.onload=function()
{
	document.getElementById("emailhide").style.display = 'none';
	document.getelementByid("phonehide").style.display = 'none';
	document.getelementByid("chathide").style.display = 'none';
	document.getelementByid("quehide").style.display = 'none';
}


function showemail()
{
	if(document.getElementById("emailbtn").checked)
	{
		document.getElementById("emailhide").style.display='block';
		document.getElementById("emailid").style.display='block';
		document.getElementById("phonehide").style.display='none';
		document.getElementById("phoneno").style.display='none';
		document.getElementById("chathide").style.display='none';
		document.getElementById("quehide").style.display='none';
	}
}
function showphn()
{
	if(document.getElementById("callbtn").checked)
	{
		document.getElementById("emailhide").style.display='none';
		document.getElementById("emailid").style.display='none';
		document.getElementById("phonehide").style.display='block';
		document.getElementById("phoneno").style.display='block';
		document.getElementById("chathide").style.display='none';
		document.getElementById("quehide").style.display='none';
	}
}
function showchat()
{
	if(document.getElementById("chatbtn").checked)
	{
		document.getElementById("emailhide").style.display='none';
		document.getElementById("emailid").style.display='none';
		document.getElementById("phonehide").style.display='none';
		document.getElementById("phoneno").style.display='none';
		document.getElementById("chathide").style.display='block';
		document.getElementById("chat").style.display='block';
		document.getElementById("quehide").style.display='none';
	}
}
function showquotes()
{
	if(document.getElementById("quebtn").checked)
	{
		document.getElementById("emailhide").style.display='none';
		document.getElementById("phonehide").style.display='none';
		document.getElementById("phoneno").style.display='none';
		document.getElementById("chathide").style.display='none';
		document.getElementById("quehide").style.display='block';
		document.getElementById("que").style.display='block';
	}
}


function validation1()
{
	document.getElementById("emailid").innerHTML="";

	var emailpattern=/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,4}$/;
	if(document.form1.email_id.value=="")
	{
		//alert(document.getElementById("email_id").value);
		document.getElementById("emailid").innerHTML="fields are mandetory";
		document.form1.email_id.focus();
		return false;
	}
	else if(!emailpattern.test(document.form1.email_id.value))
	{
		document.getElementById("emailid").innerHTML="enter valid id";
		document.form1.email_id.focus();
		return false;
	}
return true;
}


function validation2()
{
	document.getElementById("phoneno").innerHTML="";

    var phoneno = /^[0-9]{10}$/; 
	if(document.form2.phn.value=="")
	{
		document.getElementById("phoneno").innerHTML="enter phone number";
		document.form2.phn.focus();
		return false;
	}
	else if(!phoneno.test(document.form2.phn.value))
	{
		document.getElementById("phoneno").innerHTML="Your contact Number must be 10 digits number.";
		document.form2.phn.focus();
		return false;
	}
return true;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<form name="form1" method="post">
<input type="radio" value="email" name="select" id="emailbtn" onclick="showemail()" />
Email me :<span id="emailhide" style="display:none"><input type="text" size="50" name="email" id="email_id" placeholder="*************" /><input type="submit" name="email" value="email" id="emailbtn" style="font-size:16px;" onclick="return validation1()" /></span>
<span id="emailid"></span></form>	

<form name="form2" method="post">	 
<input type="radio" value="call" name="select" id="callbtn" onclick="showphn()" />
Call Me :<span id="phonehide" style="display:none"><input type="text" size="50" name="phn" id="call" placeholder="*************" /><input type="submit" name="submit" value="call" id="callbtn" onclick="return validation2()" /></span>
<span id="phoneno"></span>
</form>

<input type="radio" value="chat" name="select" id="chatbtn" onclick="showchat()" />
Chat with me<span id="chathide"><a href="#"><input style="display:none" type="submit" name="chat" id="chat" value="Go"/></a></span>
<br />
<input type="radio" value="que" name="select" id="quebtn" onclick="showquotes()" />
Detail Questionnarie<span id="quehide"><a href="#"><input type="submit" name="que" id="que" value="Go"  style="display:none"/></a></span>

Answer 1

＆＃13;

＆＃13;

window.onload=function()
{
	document.getElementById("emailhide").style.display = 'none';
	document.getelementByid("phonehide").style.display = 'none';
	document.getelementByid("chathide").style.display = 'none';
	document.getelementByid("quehide").style.display = 'none';
}


function showemail()
{
	
		document.getElementById("emailhide").style.display='block';
		document.getElementById("emailid").style.display='block';
		document.getElementById("phonehide").style.display='none';
		document.getElementById("phoneno").style.display='none';
		document.getElementById("chathide").style.display='none';
		document.getElementById("quehide").style.display='none';
	
}
function showphn()
{
	
		document.getElementById("emailhide").style.display='none';
		document.getElementById("emailid").style.display='none';
		document.getElementById("phonehide").style.display='block';
		document.getElementById("phoneno").style.display='block';
		document.getElementById("chathide").style.display='none';
		document.getElementById("quehide").style.display='none';
	
}
function showchat()
{
	if(document.getElementById("chatbtn").checked)
	{
		document.getElementById("emailhide").style.display='none';
		document.getElementById("emailid").style.display='none';
		document.getElementById("phonehide").style.display='none';
		document.getElementById("phoneno").style.display='none';
		document.getElementById("chathide").style.display='block';
		document.getElementById("chat").style.display='block';
		document.getElementById("quehide").style.display='none';
	}
}
function showquotes()
{
		document.getElementById("emailhide").style.display='none';
		document.getElementById("phonehide").style.display='none';
		document.getElementById("phoneno").style.display='none';
		document.getElementById("chathide").style.display='none';
		document.getElementById("quehide").style.display='block';
		document.getElementById("que").style.display='block';
	
}


function validation1()
{
	document.getElementById("emailid").innerHTML="";

	var emailpattern=/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,4}$/;
	if(document.form1.email_id.value=="")
	{
		//alert(document.getElementById("email_id").value);
		document.getElementById("emailid").innerHTML="fields are mandetory";
		document.form1.email_id.focus();
		return false;
	}
	else if(!emailpattern.test(document.form1.email_id.value))
	{
		document.getElementById("emailid").innerHTML="enter valid id";
		document.form1.email_id.focus();
		return false;
	}
return true;
}


function validation2()
{
	document.getElementById("phoneno").innerHTML="";

    var phoneno = /^[0-9]{10}$/; 
	if(document.form2.phn.value=="")
	{
		document.getElementById("phoneno").innerHTML="enter phone number";
		document.form2.phn.focus();
		return false;
	}
	else if(!phoneno.test(document.form2.phn.value))
	{
		document.getElementById("phoneno").innerHTML="Your contact Number must be 10 digits number.";
		document.form2.phn.focus();
		return false;
	}
return true;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<form name="form1" method="post">
<input type="radio" value="email" name="select" id="emailbtn" onclick="showemail()" />
Email me :<input type="text" size="50" name="email" id="email_id" placeholder="*************" /><input type="submit" name="email" value="email" id="emailbtn" style="font-size:16px;" onclick="return validation1()" />
<span id="emailid"></span></form>	

<form name="form2" method="post">	 
<input type="radio" value="call" name="select" id="callbtn" onclick="showphn()" />
Call Me :<input type="text" size="50" name="phn" id="call" placeholder="*************" /><input type="submit" name="submit" value="call" id="callbtn" onclick="return validation2()" />
<span id="phoneno"></span>
</form>

<input type="radio" value="chat" name="select" id="chatbtn" onclick="showchat()" />
Chat with me</a>
<br />
<input type="radio" value="que" name="select" id="quebtn" onclick="showquotes()" />
Detail Questionnarie<span id="quehide"><a href="#"><input type="submit" name="que" id="que" value="Go"  style="display:none"/></a></span>

＆＃13;

＆＃13;

＆＃13;