layui如何把表格数据保存到数据库

2025-11-16 00:31:44

1、第一步：新建一个简单的页面，页面上有table数据，代码如下：

<tr>
<th>昵称</th>
<th>加入时间</th>
<th>签名</th>
</tr>
</thead>
<tbody>
<tr>
<td id="x1">xx</td>
<td id="x2">2016-11-29</td>
<td id="x3">人生就像是一场修行</td>
</tr>
</tbody>
</table>

layui如何把表格数据保存到数据库

2、第二步：页面上添加保存保存按钮，并写上点击事件，代码如下：

$('#demo1').click(function (d) {

let data = {

}
})

layui如何把表格数据保存到数据库

3、第三步：获取table里面的数据，代码如下：

x1: $('#x1').html(),

x2: $('#x2').html(),
x3: $('#x3').html()

layui如何把表格数据保存到数据库

4、第四步：使用ajax进行数据保存，代码如下：

$.post('url', data, function (result) {

console.log(result)
})

layui如何把表格数据保存到数据库

5、第五步：运行上面的代码，可以看到数据已经请求到接口了，如图：

layui如何把表格数据保存到数据库

6、第六步：全部代码如下：

<body>

<div class="layui-container">
<table class="layui-table">
<tr>
<th>昵称</th>
<th>加入时间</th>
<th>签名</th>
</tr>
</thead>
<tbody>
<tr>
<td id="x1">xx</td>
<td id="x2">2016-11-29</td>
<td id="x3">人生就像是一场修行</td>
</tr>
</tbody>
</table>
<button class="layui-btn" lay-submit="" id="demo1" lay-filter="demo1">保存</button>
</div>
<script src="../../lib/layui-v2.5.4/layui.js?v=1.0.4" charset="utf-8"></script>
<script>
layui.use(['element', 'jquery'], function () {
let element = layui.element, $ = layui.jquery;

$('#demo1').click(function (d) {
let data = {
x1: $('#x1').html(),
x2: $('#x2').html(),
x3: $('#x3').html()
}
$.post('url', data, function (result) {
console.log(result)
})
})
});

</script>
</body>

layui如何把表格数据保存到数据库

声明：本网站引用、摘录或转载内容仅供网站访问者交流或参考，不代表本站立场，如存在版权或非法内容，请联系站长删除，联系邮箱：site.kefu@qq.com。