单选按钮设置文本框值

时间：2013-08-23 19:04:44

标签： javascript jquery html 

$(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>&nbsp;</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/

1 个答案:

答案 0 :(得分：1)

你的小提琴中有语法错误，所以我修复了它们＆amp;把它清理干净了一下。结果如下：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()取代。

相关问题
最新问题