<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
table {
width: 80%;
border-collapse: collapse;
}
td,
th {
border: 1px solid #ccc;
}
</style>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/2.1.3/jquery.js"></script>
</head>
<body>
<table>
<tbody id="tables">
<tr>
<td>1-11</td>
<td>1-22</td>
<td><input type="text" value="a1"></td>
<td><input type="text" value="a2"></td>
<td><input type="text" value="a3"></td>
</tr>
<tr>
<td>2-11</td>
<td>2-22</td>
<td><input type="text" value="a1"></td>
<td><input type="text" value="a2"></td>
<td><input type="text" value="a3"></td>
</tr>
</tbody>
</table>
<button onclick="getTableData('#tables')">点击</button>
<script>
function getTableData(element) {
/* element == tbody 的id 或者 类名 */
var tableData = [];
$(element).find('tr').each(function () {
var row = [];
$(this).find('td').each(function () {
if ($(this).find("input").length > 0) {
var inputVal = $(this).find("input").val();
row.push(inputVal);
}
else {
row.push($(this).text().trim());
}
});
tableData.push(row);
});
console.log(tableData)
return tableData;
}
</script>
</body>
</html>
网友评论