如何将表单文本恰好放在单选按钮的前面
[英]how to put form text exactly in front of radio button
问题描述
I want to put 'email me' & 'call me' text exactly in front radio button. 
我想在前面的单选按钮中准确地输入“给我发送电子邮件”和“给我打电话”文字。 In code it comes under radio button. 在代码中，它位于单选按钮下方。 Can anybody suggest me how to do this. 有人可以建议我该怎么做。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script>
$('#emailbtn').on('click',function(){
if($('#callbtn').prop('checked'))
{
$('#callbtn').prop('checked','');
}
});
$('#callbtn').on('click',function(){
if($('#emailbtn').prop('checked'))
{
$('#emailbtn').prop('checked','');
}
});
</script>
</head>
html code is html代码是
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<form name="form1" method="post" style="padding-left:8%;">
<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" style="padding-left:8%;">
<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="valency-networks-chat.html"><input style="display:none" type="submit" name="chat" id="chat" value="Go"/></a></span>
2 个解决方案
解决方案1
1 2014-12-23 10:26:12
Add the radio buttons in the forms: FIDDLE 在表单中添加单选按钮： FIDDLE
<form name="form1" method="post" style="padding-left:8%;">
<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 id="emailid"></span>
</form>
<form name="form2" method="post" style="padding-left:8%;">
<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 id="phoneno"></span>
</form>
解决方案2
0 已采纳 2014-12-23 10:27:25
$(document).on('ready',function(){$('#emailbtn').on('click',function(){ if($('#callbtn').prop('checked')) { $('#callbtn').prop('checked',''); } }); $('#callbtn').on('click',function(){ if($('#emailbtn').prop('checked')) { $('#emailbtn').prop('checked',''); } }); });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script> <form name="form1" method="post" style="padding-left:8%;"> <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" style="padding-left:8%;"> <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>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
将表单文本框和按钮放在每个单选按钮的前面 - put form textbox and button in front of every radio button
如何在单选按钮标签中添加文字？ - How can I put text in a radio button label?
如何通过选择单选按钮选项来更改文本表单字段 - How to change text form fields by selecting radio button options
如何使用Reactive表单动态设置单选按钮文本？ 并选择*单选按钮值和问题标题* onSubmit - How to set radio button text dynamically using Reactive form? and and selected *radio button value and question title * onSubmit
如何在 *ngFor 中放置单选按钮逻辑？ - How to put radio button logic in *ngFor?
如何更改单选按钮的文本 - How to change the text of a radio button
将单选按钮和标签文本的值放入两个TextField中 - Getting Value Of Radio Button And Label Text Put Into Two TextField
如果选中单选按钮，如何获取单选按钮的文本？ - How can I get the text of radio button if radio button checked?
当用户选择False Hit单选按钮时，如果文本字段为空，如何确保无法提交表单？ - How to make sure form cannot be submitted if text field is empty when user selects False Hit radio button?
如何使用 JavaScript 更改段落文本，具体取决于表单中选中的单选按钮？ - How do I change paragraph text using JavaScript, depending on which radio button is checked in a form?
相关标签