jquery监听按钮组点击事件

html页面按钮组：
主要在按钮上添加 data-method 标识需要调用哪个方法

 <!--按钮-->
<div style="padding: 5px 5px;" id="data_button">
   <button type="button" class="layui-btn layui-btn-sm" data-method="add"><i class="layui-icon layui-icon-addition"></i>新增</button>
   <button type="button" class="layui-btn layui-btn-sm" data-method="edit"><i class="layui-icon layui-icon-edit"></i>编辑</button>
   <button type="button" class="layui-btn layui-btn-sm layui-btn-danger" data-method="del"><i class="layui-icon layui-icon-delete"></i>删除</button>
</div>

jquery监听按钮点击：

 $('#data_button .layui-btn').on('click', function () {
       var othis = $(this), method = othis.data('method');
       active[method] ? active[method].call(this, othis) : '';
   });

var active = {
     add: function () {
         console.log('这是添加方法')
     },
     edit: function() {
         console.log('这是编辑方法')
     },
     del: function(){
         console.log('这是删除方法')
     }
 };

示例点击监听并传参数：

<button type="button" class="upddel " data-type='upd' data-id="2">修改</button>
<button type="button" class="upddel" data-type='del' data-id="1">删除</button>
//需要引入jquery
 //监听按钮
  $(document).on('click','.upddel', function () {
    var type = $(this).data('type');
    var id = $(this).data('id');

    if(type == "upd"){
      console.log("修改方法 id:"+id);

    }else if(type == "del"){
      console.log('删除方法 id:'+id);

    }
  });