javascript - 如何将选定的单选按钮值插入表格单元格

Question

我有 5 个单选按钮

<input type="radio" id="rating">1
<input type="radio" id="rating2">2
<input type="radio" id="rating3">3
<input type="radio" id="rating4">4
<input type="radio" id="rating5">5

我有一张 table

<table id="myTableData"  border="1" style="width:100%">
<tr id="templateRow">
            <th>Ratings</th>
        </tr>
</table>

一个添加按钮

 <input type="button" id="add" value="Add" onclick="addRadioValue()">

我已经编写了代码来动态地将行添加到表中，但是当我选择一个单选按钮然后单击添加按钮时，所选单选按钮的值应该插入到表评级中的新单元格中.

我可以对文本框执行此操作，但无法对单选按钮执行此操作。 谁能帮我吗？

Answer 1

您可以使用querySelector('input[name="rating"]:checked')

Java 脚本

function addRow() {

    var myName = document.getElementById("name");
    var auther = document.getElementById("auther");
    var publish = document.getElementById("publish");
    var rating = document.querySelector('input[name="rating"]:checked');
    var table = document.getElementById("myTableData");

    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);

    row.insertCell(0).innerHTML=count ;
    row.insertCell(1).innerHTML= myName.value;
    row.insertCell(2).innerHTML= auther.value;
    row.insertCell(3).innerHTML= publish.value;
    if(rating.checked)
        row.insertCell(4).innerHTML= rating.value;
    else
        row.insertCell(4).innerHTML= "";
    count=count+1;
}

这是我的 Demo