在纯粹的javascript中tr onclick后检查单选按钮。表演也很重要

时间:2017-12-23 12:49:41

标签: javascript jquery html

我一直在搜索如何在纯javascript中检查单选按钮,但我只看到Jquery。有人可以将此jquery代码转换为纯JavaScript或任何将做。表现也很重要。任何帮助将不胜感激

$('tr').click(
   function() {
        $('input[type=radio]',this).attr('checked','checked');
   }
);

我的HTML。在删除或更新记录之前,我使用单选按钮选择表中的记录。当用户点击一行时,我希望我的单选按钮在纯javascript中选择而不是Jquery,因为性能很重要

<tr onclick="myfunc(this)">
    <td><input type="radio" name="rd" value="somevalue"></td>
    <td>some text</td>
    <td>another text</td>
</tr>
<tr onclick="myfunc(this)">
    <td><input type="radio" name="rd" value="somevalue"></td>
    <td>some text</td>
    <td>another text</td>
</tr>
<tr onclick="myfunc(this)">
    <td><input type="radio" name="rd" value="somevalue"></td>
    <td>some text</td>
    <td>another text</td>
</tr>
<!-- more tr -->

<script type="text/javascript">
    function myfunc(o){
        o.onclick = function() {

            // code goes here
            o.("input[type=radio]").checked = true; //something like this
        }

    }
</script>

1 个答案:

答案 0 :(得分:0)

我为你做了一个例子。它由two radio groups组成。顶部的一个单独在它自己的行中,而底部的无线电组由两个单独的按钮组成,每个按钮都在它自己的单元格中。

您所要做的就是通过您想要改变的收音机的id。像这样(运行代码段):

function checkMe(id)
{
  document.getElementById(id).checked = true;
}
<table border="1" cellspacing="0">
<tr onclick="checkMe('radio1')">
  <td colspan="2"><input type="radio" name="radioFirst" id="radio1" /></td>
</tr>
<tr>
  <td onclick="checkMe('radio2')"><input type="radio" name="radioSecond" id="radio2" /></td>
  <td onclick="checkMe('radio3')"><input type="radio" name="radioSecond" id="radio3" /></td>
</tr>
</table>