原生js循环获取表格中input的值
Posted 今天想转行了吗
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了原生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)
以上是关于原生js循环获取表格中input的值的主要内容,如果未能解决你的问题,请参考以下文章
jsp 和 js,如何在js脚本中循环给jsp页面的表格添加一行,请看代码?
用js获取循环中type为number的input框中变动的value值,但只有第一行能获取到变动数值,其他行只能获取1