用js 在table里循环添加一行,每行里有一组radio,怎样实现每组radio都能单选

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了用js 在table里循环添加一行,每行里有一组radio,怎样实现每组radio都能单选相关的知识,希望对你有一定的参考价值。

我用的button click事件实现在table最后加一行,每行里有两个radio,运行时加的第一行可以实现单选,因为设置的起始name是一样的,但从加的第二行开始已经是四个radio了还是只能选一个,我知道循环添加的radio name是一样导致的。但实现添加table的行时,每行radio都能单选该怎么办?

给每行添加一个计数属性cid,该行radio的name="abc"+cid

js添加行时读取当前最后一行的cid,然后cid = parseInt(cid) + 1

例如:

function add() 
    //...
    //get elements
    var tr = getElementsByTagName('tr');
    var cid = tr[tr.length-1].getAttribute('cid');
    cid = parseInt(cid) + 1;
    name = "abc" + cid;
    //...
    //...set attribute
    //...add elements
    //...
;

参考技术A <table id="table1">
    <tr>
        <td>
            <input name="tr1" type="radio" value="1" />男
            <input name="tr1" type="radio"  value="2" />女
        </td>
    </tr>
</table>
<input type="button" onclick="addInput()" value="click"  />

function addInput() 
    var table = document.getElementById("table1");
    var id = (new Date()).valueOf();//为每行生成一个唯一name,radio是组的概念
    var tr = document.createElement("tr");
    tr.innerhtml = "<td><input name=\\"tr" + id + "\\" type=\\"radio\\" value=\\"1\\" />男 <input name=\\"tr" + id + "\\" type=\\"radio\\" value=\\"2\\" />女</td>";
    table.appendChild(tr);

参考技术B 新手,帮顶!
百度一下有很多资料的!这里不让发链接,没办法给你指出来了!

小尾巴:http://jingyan.baidu.com/article/a65957f49e34a424e77f9b49.html

JS怎么在table列表中增加click事件

通过循环把结果数组里的每一个做成一个table显示,现在我给循环里的table加上了id属性,然后写了一个$(tableid).click(function)的方法,结果是只有最后一条点击的时候可以触发click函数。怎么才能让每一个都可以点击触发事件。把click写成table的属性可以吗,怎么写

你别用ID应该就好了。
你这样:
$("table").click(function ())
应该就可以了。(因为在一个HTML文件里,标签的ID是不能重复的)
参考技术A <!DOCTYPE HTML>
<html>
<head>
<meta charset=UTF-8>
<meta name="keywords" content="白菜编辑部">
<title>白菜编辑部</title>
<style type="text/css">
table 
border: 1px solid black;
border-collapse: collapse;


td 
border: 1px solid black;

</style>
<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
<script type="text/javascript">
var data = [
            "11", "22", "33"
    ];
    $ (function ()
    
    $ ('body').delegate ('table#tableid', 'click', function ()
    
    alert ($ (this).attr ('id'));
    );
    $ (data).each (function (i, dom)
    
    $ ('body').append ("<table id='tableid'><tr><td>" + dom + "</td></tr></table>");
    );
    );
</script>
</head>
<body>

</body>
</html>

本回答被提问者和网友采纳

以上是关于用js 在table里循环添加一行,每行里有一组radio,怎样实现每组radio都能单选的主要内容,如果未能解决你的问题,请参考以下文章

html js把table数据一行一行往excel里面加

怎样根据数据库里的数据自动生成Table

如何用JS在alert中显示table每一行里的值,每行中有checkbox,text,radio男女,和select!

jquery里怎么用clone给表格增加一行

C#中怎样用for循环为datatable的每一行每一列都赋值为“*”?

JS怎么在table列表中增加click事件