0

这是我第一次在 stackoverflow 上发布我的查询。我创建了一个表格，表格中有几个城市的下拉列表。在下拉更改相关的单选按钮组上显示。每个单选按钮的名称都与“preferred_location”相同。

在任何单选按钮选择上，我都想将一个复选框标记为已选中。我在网上尝试了很多可用的选项，它们听起来很简单，可以在演示中使用，但在我的代码中却没有。为了查看我在下面发布了我的代码示例：

jQuery脚本

$(document).ready(function(){
        $("#address input[name*='redio']").click(function() {
            $('#note').removeClass("inactive").addClass("active");
        });  
    });

要在更改下拉列表时显示单选按钮组，我使用以下代码

if(valuecheckdrop == "Coimbatore"){ 
   $("#address").html("<h2>Select date of info session:</h2>",
       "<p>",
       "<input type='radio' name='preferred_location' value='Radio1' class='redio' /> Radio1",
       "</p>",
       "<p class='sub'>address</p>",
       "<p class='option'>",
           "<input type='radio' name='preferred_location' value='Radio2'  class='redio' />Radio2",
       "</p>",
       "<p class='sub'>Address2</p>");
}

在单选按钮的下拉更改组中显示，但单击单选按钮时没有任何反应。

是因为我在下拉更改事件上调用单选按钮吗？任何帮助将不胜感激。

4

2 回答 2

0 
   $(document).ready(function () {
                $("#graduate").change(function () {
                    var valuecheckdrop = $("#graduate").val();
                     $('#cbTest').prop('checked', false);
                    if (valuecheckdrop == "") {
                        $("#note").show();

                        //$("#address").removeClass("addresson").addClass("addressoff");
                        //Or
                        $("#address").html('');

                    } else {
                        $("#note").hide();

                        //$("#address").removeClass("addressoff").addClass('addresson');

                        switch (valuecheckdrop) {
                            case 'Bangalore':
                                $("#address").html("<h2>Select date of info session:</h2><p><input type='radio' name='preferred_location' value='June 2, 2012, Sat 11am - 1pm The Presidency, No. 1 St Marks Road' class='redio' /> June 2, 2012 <span>(Sat 11am - 1pm)</span></p><p class='sub'>The Presidency, No. 1 St Marks Road</p><p class='option'><input type='radio' name='preferred_location' value='June 2, 2012, Sat 3pm - 5pm Manipal Center, Dickenson Road' class='redio' /> June 2, 2012 <span>(Sat 3pm - 5pm)</span></p><p class='sub'>Manipal Center, Dickenson Road</p><p class='option'><input type='radio' name='preferred_location' value='June 3, 2012, Sun 12noon - 5pm Taj Gateway Hotel, Residency Road' class='redio' />June 3, 2012 <span>(Sun 12noon - 5pm)</span></p><p class='sub'>Taj Gateway Hotel, Residency Road</p><p class='option'><input type='radio' name='preferred_location' value='June 4, 2012, Mon 11am - 1pm S&B Towers, MG Road' class='redio' />June 4, 2012 <span>(Mon 11am - 1pm)</span></p><p class='sub'>S&B Towers, MG Road</p>");
                                break;
                            case 'Chandigarh':
                                $("#address").html("<h2>Select date of info session:</h2><p><input type='radio' name='preferred_location' value='May 26, 2012, Sat 10:30am - 5:30pm The Park Hote, Anna Salai' class='redio' /> May 26, 2012 <span>(Sat 10:30am - 5:30pm)</span></p><p class='sub'>The Park Hote, Anna Salai</p><p class='option'><input type='radio' name='preferred_location' value='May 28, 2012, Mon 1pm - 3pm No. 16, Nungambakkam' class='redio' />May 28, 2012<span>(Mon 1pm - 3pm)</span></p><p class='sub'>No. 16, Nungambakkam</p><p class='option'><input type='radio' name='preferred_location' value='May 28, 2012, Mon 10am - 12noon Sindur Shopping Centre, Anna Nagar' class='redio' /> May 28, 2012 <span>(Mon 10am - 12noon)</span></p><p class='sub'>Sindur Shopping Centre, Anna Nagar</p>");
                                break;
                        }

                        //$("#address").find(':radio:first').prop('checked', true);
                    }
                });

                $("#graduate").trigger('change');

                $("#address").find(':radio').live('click', function (e) {
                    $('#cbTest').prop('checked', $("#address").find(':radio:checked').length > 0);
                });
            });​
于 2012-05-23T10:59:15.973 回答
0

试试这个

$(document).ready(function(){
    $("#address input[name*='radio']").on('click',function() {
        $('#note').removeClass("inactive").addClass("active");
    });
});
于 2012-05-23T11:00:35.370 回答