Question

我正在开发一个小应用程序，我想在一行中创建20个单选按钮。

如何使用jQuery执行此操作？

Answer 1

我认为这符合您的目的：

for (i = 0; i < 20; i++) {
    var radioBtn = $('<input type="radio" name="rbtnCount" />');
    radioBtn.appendTo('#target');
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="target"></div>

Answer 2

您可以在for循环中使用appendTo()执行此操作：

for (i = 0; i < 20; i++) {
    $('<input type="radio" name="dynradio" />').appendTo('.your_container');
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="your_container"></div>

Answer 3

有些事情：

for (i = 0; i < 20; i++) {
    $('#element').append('<input type="radio" name="radio_name" />');
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="element"></div>

Answer 4

＆＃13;

for (i = 0; i < 20; i++) {
    $('<input type="radio" name="radiobtn" >Yourtext'+i+'</input>').appendTo('#container');
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container"></div>

＆＃13;

Answer 5

此代码会为每个按钮添加唯一ID的单选按钮....

for (var i=0;i<=20;i++)
{
 $("#yourcontainer").append("<input type='radio' id='myRadio"+i+"'>")
}

Answer 6

您必须找到应包含单选按钮的元素，并append()：

＆＃13;

var container = $('#radio_container');
for (var i = 0; i < 20; i++) {
    container.append('<input type="radio" name="radio_group" value="' + i + '">');
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="radio_container">Choose one: </div>

＆＃13;

因此，您只搜索一次容器（与其他答案不同），并为每个收音机分配一个值，以便您识别该选项。

Answer 7

假设您有一个ID = myDivContainer的div 试试这个：

for (i=0;i<=20;i++)
{
$("#myDivContainer").append('<input type="radio" />')
}

Answer 8

for (var i=0;i<=20;i++)
  {
  $("#yourcontainer").append("<input type='radio' name='myRadio' />");
  }

如何使用jQuery动态创建单选按钮？

8 个答案: