单选按钮设置文本框值
Posted
技术标签:
【中文标题】单选按钮设置文本框值【英文标题】：radio button sets text box value 【发布时间】：2013-08-26 22:25:13 【问题描述】：$(function ()
$("input[name='rbSelection']").change(function ()
switch (this.value)
case "1":
caption = "Daily";
form_content = '<div class="divborder"><input type="radio" class="inputed" name="Every_Days" value="every_days" /><span>Every</span> <input type="text" size="1" name="Every_Days_Amount" value="1" /> <span>Day(s)</span><br /></div><div class="divborder"><input type="radio" class="inputed" name="Every_Dayweekday" disabled="disabled" value="every_weekday" /><span>Every Weekday</span></div>';
break;
case "2":
caption = "Weekly";
form_content = '<div class="divborder"><input type="radio" class="inputed" name="Every_Weeks" value="every_Weeks" /><span>Recur every</span> <input type="text" size="1" name="Every_Week_Amount" value="1" /><span> Weeks(s) on </span><select name="Weekly_Day" id="Weekly_Day"><option value="1" selected>Monday</option><option value="2">Tuesday</option><option value="3">Wednesday</option><option value="4">Thursday</option><option value="5">Friday</option><option value="6">Saturday</option><option value="7">Sunday</option></select></div>';
break;
case "3":
caption = "Monthly";
form_content = '<div class="divborder"><input type="radio" class="inputed" name="Every_Month" value="every_Months" /><span>Day</span> <input type="text" size="1" name="Every_Month_Day_Amount" value="31" /> <span>of every</span> <input type="text" size="1" name="Every_Week_Amount" value="1" /> <span>month(s)</span><br></div><div class="divborder"><input type="radio" class="inputed" name="Every_The_Month" value="every_the_Months" /><span>The</span> <select name="Monthly_what" id="Monthly_what"><option value="First">First</option><option value="Second">Second</option><option value="Third">Thrid</option><option value="Fourth">Fourth</option><option value="Last" selected>Last</option></select> <select name="Weekly_Day" id="Weekly_Day"><option value="1" selected>Monday</option><option value="2">Tuesday</option><option value="3">Wednesday</option><option value="4">Thursday</option><option value="5">Friday</option><option value="6">Saturday</option><option value="7">Sunday</option></select> <span>of every </span><input type="text" size="1" name="Every_Week_Amount" value="1" /> <span>month(s)</span></div>';
break;
case "4":
caption = "Yearly";
form_content = '<div class="divborder"><input type="radio" class="inputed" name="Every_Years" value="every_years" /><span>Every</span> <select name="year_month" id=""><option value="1">January</option><option value="2">February</option><option value="3">March</option><option value="4">April</option><option value="5" selected>May</option><option value="6">June</option><option value="7">July</option><option value="8">August</option><option value="9">September</option><option value="10">October</option><option value="11">November</option><option value="12">December</option></select> <select id="DaySelection"><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option><option value="23">23</option><option value="24">24</option><option value="25">25</option><option value="26">26</option><option value="27">27</option><option value="28">28</option><option value="29">29</option><option value="30">30</option><option value="31" SELECTED>31</option></select><br></div><div class="divborder"><input type="radio" class="inputed" name="Every_The_Month" value="every_the_Months" /><span>The</span> <select name="Monthly_what" id="Monthly_what"><option value="First">First</option><option value="Second">Second</option><option value="Third">Thrid</option><option value="Fourth">Fourth</option><option value="Last" selected>Last</option></select> <select name="Weekly_Day" id="Weekly_Day"><option value="1" selected>Monday</option><option value="2">Tuesday</option><option value="3">Wednesday</option><option value="4">Thursday</option><option value="5">Friday</option><option value="6">Saturday</option><option value="7">Sunday</option></select> <span>of</span> <select name="" id=""><option value="1">January</option><option value="2">February</option><option value="3">March</option><option value="4">April</option><option value="5" selected>May</option><option value="6">June</option><option value="7">July</option><option value="8">August</option><option value="9">September</option><option value="10">October</option><option value="11">November</option><option value="12">December</option></select></div>';
break;
case "5":
caption = "Misc";
form_content = '<div class="divborder"><input type="radio" class="inputed" name="Every_5th_Sunday_of_Month" disabled="disabled" value="Every_5th_Sunday_of_Month" />Every 5th Sunday of Month<br></div><div class="divborder"><input type="radio" class="inputed" name="Every_Easter" disabled="disabled" value="every_Easter" />Every Easter</div>';
break;
default:
caption = "default";
form_content = "test Default";
$("#content").html(form_content);
//$("#content").html(form_content + "<br><br>" + caption + "<br> - Load content div with option " + this.value);
);
);
</td>
</tr>
<tr bgcolor="whitesmoke"><td><p> </p></td><td>
<DIV ALIGN="left" id="Date_String_Input">
<input type="text" name="date_string" size="75" id="date_string">
</DIV>
在上面的代码中，我试图用选定的值填充textbox(date_string)
我试过了：
if ($('#Every_Days:checked').val() == 'true')
alert("hello");
//$("#date_string").val("every ".$("#Every_Days_Amount").val());
和其他一些查找的帖子
Jquery If radio button is checked
Find out if radio button is checked with JQuery?
没有什么可以触发事件的。
这是我的文档，以备不时之需
<script type="text/javascript">
jQuery(document).ready(function ()
$("#generate").val("Save Info");
if ($('#Every_Days:checked').val() == 'true')
alert("hello");
jQuery("#dateTimeCustom").dynDateTime(
showsTime: true,
ifFormat: "%Y-%m-%d %H:%M:00",
daFormat: "%a, %b %e, %Y [%I:%M %p]",
align: "TL",
electric: false,
singleClick: false,
displayArea: ".siblings('.dtcDisplayArea')",
button: ".next()" //next sibling
);
jQuery("#dateTimeCustom2").dynDateTime(
showsTime: true,
ifFormat: "%Y-%m-%d %H:%M:00",
daFormat: "%a, %b %e, %Y [%I:%M %p]",
align: "TL",
electric: false,
singleClick: false,
displayArea: ".siblings('.dtcDisplayArea2')",
button: ".next()" //next sibling
);
$("radio[name='daterbSelection']").click(function ()
alert('test');
if ($(this).val() === 'r')
if ($(this).is(":checked"))
$("#r_date").show();
else
$("#r_date").hide();
);
);
更新： 我试过的东西还是不行
$('#Every_Days').click(function ()
var isChecked = $('#Every_Days').prop('checked');
alert(isChecked);
);
$("#Every_Days").click(function ()
alert("days");
if ($("input:radio[name=Every_Days]").is(":checked"))
alert("hello");
//$("#date_string").val("every ".$("#Every_Days_Amount").val());
);
//$("#date_string").val("every ".$("#Every_Days_Amount").val());
//$('#date_string').val($('#Every_Days_Amount').val());
// works value to textbox - Pattern
//$('#date_string').val('5555');
//alert("hi: ".$('#Every_Days_Amount').val());
function XEvery_Days()
//some code
alert("hello");
在表单输出区：
form_content = '<div class="divborder"><input type="radio" title="ie every 2 days for every other day" class="inputed" name="Every_Days" id="Every_Days" value="every" onClick="XEvery_Days()" /><span>Every</span> <input type="text" size="1" name="Every_Days_Amount" id="Every_Days_Amount" value="2" /> <span>Day(s)</span><br /></div><div class="divborder"><input type="radio" class="inputed" name="Every_Dayweekday" disabled="disabled" value="every_weekday" /><span>Every Weekday</span></div>';
仍在努力解决这个问题 - 2013 年 8 月 30 日 我问了一个朋友，他给我发了这个说它应该可以工作（他没有时间测试也不能帮助我一个月，因为他要出城） 但它不起作用。什么也没做。 也许有人可以帮我弄清楚为什么它看起来应该可以工作 新代码：
$('.inputed').live('click blur change', function()
alert('hi');
window.container = '';
var container = '';
$(this).parents().each(function()
var valueClass = $(this).attr("class");
if (valueClass == 'divborder')
$(this).children().each(function()
if ($(this).attr('type') != 'radio')
if ($(this).is('select'))
window.container += ' ' + $(this).find(":selected").text() + ' ';
else
window.container += ' ' + $(this).val();
window.container += ' ' + $(this).text() + ' ';
);
);
$("#date_string").val(window.container);
);
);
截至 2013 年 8 月 30 日，我没有用新代码更新 jsfiddle 最新的 jsfiddle 现在可以切换到表单： http://jsfiddle.net/2p6qQ/9/
【问题讨论】：
id="Every_Days" 的元素在哪里？也许你可以设置一个 jsfiddle 供我们修改？
是的，我注意到我刚才缺少 id=。我添加了 id 仍然没有快乐
我也没有看到名称为 rbSelection 的输入。你能设置一个fiddle吗？
如果你去 jsfiddle，你可以将你的 html、javascript 和 css 粘贴到各自的框架中。然后点击运行，它会尝试生成内容（在右下角）。运行后，点击保存，然后将链接粘贴回此处。
好吧，坦率地说，你的页面是一团糟。您已在标题中注明“收音机”，但未在问题中显示该标记，并且它似乎隐藏在小提琴中，您需要隔离您需要帮助的部分。隔离。仅供参考，font 标签应该是带有class="someclass" 的span，然后使用 CSS 设置样式。您将代码混合在标记中，将其放在外部文件中并将其链接，给自己一个表面上维护它的机会。为了尝试提供帮助，我在您的部分代码中创建了这个小提琴：jsfiddle.net/YTTfF - 似乎主要是功能性的。
【参考方案1】：
你的小提琴中有语法错误，所以我修复了它们并清理了一下。结果在这里：http://jsfiddle.net/2p6qQ/12/。点击事件是这样附加的：
$(document).on('click', '#Every_Days', function (e)
if ($(this).is(":checked"))
alert("is checked");
);
在此处开始阅读有关事件代表的信息：http://api.jquery.com/delegate/，此后已被 .on() 取代。
【讨论】：
以上是关于单选按钮设置文本框值的主要内容，如果未能解决你的问题，请参考以下文章