Javascript 如何使用 jQuery 动态创建单选按钮?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5550785/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to create a radio button dynamically with jQuery?
提问by hardik9045
I am developing a small application in which I want to create 20 radio buttons in one row.
我正在开发一个小应用程序,我想在其中在一行中创建 20 个单选按钮。
How can I do this using jQuery?
我如何使用 jQuery 做到这一点?
回答by Deviprasad Das
I think this will serve your purpose:
我认为这将有助于您的目的:
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>
回答by fabrik
You can do it with appendTo(), within a for loop:
您可以在 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>
回答by kieran
Something along the lines of:
类似的东西:
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>
回答by kiran kumar
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>
回答by Sangeet Menon
This code will append radio buttons with unique id to each of them....
此代码将向每个按钮附加具有唯一 ID 的单选按钮....
for (var i=0;i<=20;i++)
{
$("#yourcontainer").append("<input type='radio' id='myRadio"+i+"'>")
}
回答by Palec
You have to find the element that should contain your radio buttons and append()
them:
你必须找到应该包含你的单选按钮和append()
它们的元素:
var container = $('#radio_container');
for (var i = 0; i < 20; i++) {
container.append('<input type="radio" name="radio_group" value="' + i + '">');
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="radio_container">Choose one: </div>
Thus you search for the container only once (unlike in the other answers) and assign a value to each radio that lets you identify the choice.
因此,您只搜索容器一次(与其他答案不同)并为每个无线电分配一个值,以便您识别选择。
回答by Jobelle
for (var i=0;i<=20;i++)
{
$("#yourcontainer").append("<input type='radio' name='myRadio' />");
}
回答by Mohammed Swillam
Assuming that you have a div with the ID=myDivContainer try this:
假设你有一个 ID=myDivContainer 的 div 试试这个:
for (i=0;i<=20;i++)
{
$("#myDivContainer").append('<input type="radio" />')
}