layui 的form.on

layui 的 `form.on` 是一个事件监听器，用于监听表单元素的交互事件，比如点击、选择、输入等。其用法类似于 jQuery 的 `on` 方法，可以传入一个选择器和回调函数，实现对表单元素的事件监听。例如，下面的代码监听了一个表单元素的提交事件：

layui.use('form', function(){
  var form = layui.form;
  form.on('submit(formDemo)', function(data){
    console.log(data.field); // 打印表单数据
    return false; // 阻止表单提交
  });
});

其中，`formDemo` 是表单元素的 lay-filter 属性值，用于指定该表单元素的唯一标识。回调函数中的 `data.field` 就是表单提交的数据，可以在此处对表单数据进行处理或验证。

相关问题

layui form.on select获取选中的name和value

可以通过监听 layui 的 form 组件的 select 事件来获取选中的 name 和 value 值。具体代码如下：

form.on('select(selectId)', function(data){
  var name = data.elem[data.elem.selectedIndex].text;
  var value = data.value;
  console.log("选中的name为：" + name + "，选中的value为：" + value);
});

其中，`selectId` 为你的 select 组件的 id 属性值。在回调函数中，`data.elem` 代表当前 select 元素，`data.value` 代表选中的 value 值，使用 `data.elem.selectedIndex` 可以获取选中的 option 元素的下标，从而获取对应的 name 值。

layui form.on('switch(active)', function(obj){}) 监听事件中获取行数据

在监听事件中获取行数据，可以通过以下方式：

1. 在渲染表格时，给每一行数据添加一个自定义属性，例如 `data-id`，存储该行数据的唯一标识，如下所示：

table.render({
  elem: '#demo',
  url: '/demo/table/user/',
  cols: [[
    {field:'id', title:'ID', width:80},
    {field:'username', title:'用户名', width:120},
    {field:'sex', title:'性别', width:80, sort:true},
    {field:'city', title:'城市', width:100},
    {field:'sign', title:'签名', width:200},
    {field:'experience', title:'积分', width:80, sort:true},
    {field:'score', title:'评分', width:80, sort:true},
    {field:'classify', title:'职业', width:100},
    {field:'wealth', title:'财富', width:135, sort:true},
    {fixed:'right', title:'操作', toolbar:'#barDemo', width:150}
  ]],
  page: true,
  done: function(res, curr, count) {
    var data = res.data;
    for (var i = 0; i < data.length; i++) {
      var item = data[i];
      $('tr[data-index="'+ i +'"]').attr('data-id', item.id);
    }
  }
});

2. 在监听事件中，通过 `$(this)` 获取到当前触发事件的元素，再通过 `.parents('tr')` 方法获取到该元素所在的行，最后通过 `.attr('data-id')` 方法获取该行数据的唯一标识，如下所示：

form.on('switch(active)', function(obj){
  var id = $(this).parents('tr').attr('data-id');
  // 根据 id 获取该行数据，并进行后续操作
});