layui表格的头部工具栏事件如何获取被点击的按钮元素

在 layui表格的头部工具栏中，可以通过监听 toolbar 事件来获取被点击的按钮元素。具体实现步骤如下：

1. 在表格渲染时，通过 toolbar 参数配置头部工具栏按钮的 HTML 代码，例如：

layui.table.render({
  elem: '#table',
  toolbar: '<div><button class="layui-btn layui-btn-sm" lay-event="btn1">按钮1</button><button class="layui-btn layui-btn-sm" lay-event="btn2">按钮2</button></div>',
  // ...
});

2. 在表格渲染后，通过 on() 方法监听 toolbar 事件，例如：

layui.table.on('toolbar(table)', function(obj){
  var event = obj.event; // 获取事件名称
  var elem = $(obj.event.target); // 获取被点击的元素
  console.log('点击了按钮：', event, elem);
});

其中，on() 方法中的第一个参数为事件名称，第二个参数为回调函数，回调函数中的 obj 参数包含了当前事件的相关信息，如事件名称、当前表格对象等。我们可以通过 obj.event 来获取事件名称，通过 $(obj.event.target) 来获取被点击的元素。

相关问题

layui的头部工具栏

Layui的头部工具栏是table组件的一个功能，可以在数据表格的头部显示一个工具栏区域，用来集中展示一些常用的操作按钮。通过设置toolbar参数来指定工具栏的内容。toolbar参数可以是一个选择器，指向自定义的工具栏模板，也可以直接传入工具栏的HTML字符。 为了开启表格的工具栏，需要在表格渲染时设置toolbar为true。开启工具栏后，可以在头部工具栏中显示一些常用的操作按钮，比如显示或隐藏表格的列、导出表格当前页的所有数据、打印表格当前页的所有数据等。<span class="em">1</span><span class="em">2</span><span class="em">3</span>

layui点击表格每行的按钮获取每行的内容呢

在layui中，我们可以使用表格组件中的事件监听来实现点击表格每行按钮获取每行内容的功能。

首先，我们需要在表格中定义一个按钮列，通过设置templet属性来渲染每行的按钮。例如：

[
  {field: 'id', title: '序号'},
  {field: 'name', title: '姓名'},
  {field: 'age', title: '年龄'},
  {fixed: 'right', align: 'center', toolbar: '#toolbar', title: '操作'}
]

其中，`toolbar`属性指定了一个id为`#toolbar`的模板，我们需要在页面中定义这个模板：

<script type="text/html" id="toolbar">
  <a class="layui-btn layui-btn-xs" lay-event="detail">查看</a>
</script>

接下来，我们需要监听表格row事件，在监听回调函数中获取每行的数据。例如：

table.on('tool(test)', function(obj){
  var data = obj.data; //当前行的数据
  var layEvent = obj.event; //当前行的事件

  if(layEvent === 'detail'){ //如果点击的是查看按钮
    console.log(data); //输出当前行的数据
  }
});

在上述代码中，我们通过`obj.data`获取到了当前行的数据，然后可以根据需要进行进一步处理。

注意，`test`是表格的lay-filter属性值，需要根据实际情况进行调整。

综上所述，我们可以通过上述方法来实现在layui中点击表格每行按钮获取每行内容的功能。