Question

我正在尝试在容器中创建单选按钮。无线电接收器的总数是从另一个容器中的Combobox中选择的值提供的，当我尝试这样做时，即使提供的数量超过1，我只显示1个单选按钮，我也得到了这些附加到上一个选择按钮，而不是我需要在更改选择时清除内容，并且只应显示新的按钮数。

$(document).ready(function(){

$("#choice").change(function(){

    var radio_name=$("#choice option:selected").text();
    var a=$("#choice option:selected").val();
    var element=$('<input type="radio" name='+ radio_name +'/><br>');
    for(i=1;i <= a;i++){

       element.prependTo('#reports');
    }
 });

 });
      </script> 
     </head>
     <body>
    <div style="padding-top:20px;padding-left: 300px;color: orange;">
    Select Your Choice:&nbsp;&nbsp;<select id='choice' style="width:100px;">
       <option>Select Your Choice</option>
    <option value="4">Sales</option>
    <option value="2">Income</option>
    <option value="3">Consumer</option>
    <option value="5">Exports</option>
    </select>

    </div>
    <div id="reports" style='float: left;padding-top: 100px;color:orange;'>

    </div>

Answer 1

element的价值不能在HTML中重复。

您需要在循环中定义element，或者，因为我没有看到任何将无线电定义为变量的用法，您可以这样做：

$("#choice").change(function(){

    $( '#reports' ).empty();

    var radio_name=$("#choice option:selected").text();
    var a=$("#choice option:selected").val();

    for(i=1;i <= a;i++)
        $( '<input type="radio" name='+ radio_name +'/><br>' ).prependTo('#reports');

});

empty()用于清除容器。

Answer 2

尝试以下方法：

$(document).ready(function(){

    $("#choice").change(function(){
        var radio_name=$(this).text();
        var element=$('<input type="radio" name='+ radio_name +'/><br>');
        element.appendTo('#reports');
     });

});

获取所选项目文字
使用所选项目文字创建新的无线电元素
将新元素附加到报告div

最诚挚的问候，

Answer 3

我看到了一些调整，比如名称需要一个[]来使它成为数组的一部分。我认为它们的主要问题是，每当需要创建一个新对象时，正在重新创建正在创建的元素对象。

我在jsFiddle上测试以确保jsFiddle

$(document).ready(function(){

    $("#choice").change(function(){

        var radio_name=$("#choice option:selected").text();
        var a=$("#choice option:selected").val();
        for(i=1;i <= a;i++){
           $('<input type="radio" name="'+radio_name+'[]" /><br>').prependTo('#reports');
        }
     });

 });

Answer 4

在for语句中，您从i=1;开始，并告诉函数运行到i <= a。

如果不是，那么将a的值设置为正整数至少等于并不重要> i。因此，您只需追加一次。

Jquery动态单选按钮

4 个答案: