javascript - 显示表格单元格内容 onClick 如果相应的 Checkbox 被选中

Question

我有一个表格如下..我需要显示表格单元格内容如果在按钮上选中相应的复选框点击

例如:

If Row2 is checked, alert box should say Row2

这是我的代码，

JavaScript:

<script type="text/javascript">
function whichRow(tableID){ 
 var table = document.getElementById(tableID);
 var rowCount = table.rows.length;
 for(var i=0; i<rowCount-1; i++) {
 var cell_val=table.rows[i].cells[1].innerHTML;
 alert(cell_val);
}
}
</script>

HTML:

<table id="Item1">
 <tr><td>Row 1</td><td><input name="rowno" type="checkbox"/></td></tr>
    <tr><td>Row 2</td><td><input name="rowno" type="checkbox"/></td></tr>
    <tr><td>Row 3</td><td><input name="rowno" type="checkbox"  /></td></tr>
    <tr>
      <td colspan="2"><input type="submit" name="button" id="button" value="Submit" onclick="whichRow('Item1')" /></td>
    </tr>
</table>

Problem that I am facing:

目前我能够检索复选框的 innerHTML 但无法确定其是否已选中...

Answer 1

如果我理解正确你的问题，你可以这样试试。

编辑 根据评论更新

function whichRow(tableID) {
    var table = document.getElementById(tableID);
    var rowCount = table.rows.length;
    var inputBoxes = table.getElementsByTagName('input'); //modified to get only input tags present within the table
    for (var i = 0; i < rowCount - 1; i++) {
        if (inputBoxes[i].checked) { //checks if the checkbox is selected
            var cell_val = table.rows[i].cells[0].innerHTML;
            alert(cell_val);
        }
    }
}

Working Demo