Wie erstellt man einen Radio-Button dynamisch mit jQuery?

Question

Ich entwickle eine kleine Anwendung, in der ich 20 Optionsfelder in einer Reihe erstellen möchte.

Wie kann ich dies mit jQuery tun?

Answer 1

Ich denke, das wird Ihren Zweck erfüllen:

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

Sie können dies tun mit appendTo() innerhalb einer for-Schleife:

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

Etwas in der Art von:

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

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

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

Answer 5

Dieser Code fügt Radiobuttons mit einer eindeutigen ID zu jedem von ihnen hinzu....

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