js获取table的td中的<input type="checkbox" >中的checkbox

Posted 2023-05-17

jsp代码：
<table border="1px yellow solid" id="tableId">
<caption>用户列表</caption>

<c:forEach items="$pageResult.customers" var="customer" varStatus="status">
<tr>
<td>
<input type="checkbox" name="check" value="$custom.id "/>
</td>
<tr>
</c:forEach>
js代码：
function deleteCur()
var tableElement = document.getElementById("tableId");
var size = tableElement.rows.length;
alert(size);
var selectedIds = "";
for(var i =1;i<size-2;i++)
var checkbox = tableElement.rows[i].cells[0].firstChild.type;// 想获取每行第一列中的checkbox，然后判断是否选中，但是报错
alert(checkbox);
if(checkbox.checked==true)
selectedIds += checkbox.value + "_";


alert(selectedIds);

参考技术A var checkbox = document.getElementsByName("check")[i];本回答被提问者采纳

原生js循环获取表格中input的值

  　　　　　　<table>
                <tbody class="tbody" id="pileListItemDesc">
                    <tr class="text-center lastTr">
                        <td class="index">4</td>
                        <td class="depth"><input type="text" name="depth" class="input-none input-disabled" value="1.2"
                                disabled=""></td>
                        <td class="hammerValue"><input type="text" name="hammerValue" class="input-zt" value="18"></td>
                        <td class="correctValue">
                            <input type="text" name="correctValue" class="input-zt" ignore="ignore" value="">
                        </td>
                        <td class="description"><input type="text" name="description" class="input-zt" value="-"></td>
                        <td class="remark"><input type="text" name="remark" class="input-zt" value="-"></td>
                        <td></td>
                    </tr>
                    <tr class="text-center">
                        <td class="index">3</td>
                        <td class="depth"><input type="text" name="depth" class="input-none input-disabled" value="0.9"
                                disabled=""></td>
                        <td class="hammerValue"><input type="text" name="hammerValue" class="input-zt" value="14"></td>
                        <td class="correctValue">
                            <input type="text" name="correctValue" class="input-zt" ignore="ignore" value="">
                        </td>
                        <td class="description"><input type="text" name="description" class="input-zt" value="-"></td>
                        <td class="remark"><input type="text" name="remark" class="input-zt" value="-"></td>
                        <td></td>
                    </tr>
                </tbody>
            </table>

css代码清单：

 var tbody = document.getElementById("pileListItemDesc");
    var rows = tbody.rows; //获取行
    var depthList = [];
    for (var i = 0; i < rows.length; i++) {
        var obj = {};
        var cells = rows[i].cells; //获取列
        for (var j = 0; j < cells.length; j++) {
            var input = cells[j].getElementsByTagName("input");
            if (input.length == 0) {
                if (cells[j].getAttribute(‘class‘) === ‘index‘) {//获取index的值
                    obj["index"] = cells[j].innerText
                }
            } else {
                var val = input[0].value;
                var name = input[0].name;
                obj[name] = val;
            }
        }
        depthList.push(obj);
    }
    console.log(depthList)