如何为Webix Gantt的任务项添加onTaskClick点击事件

Webix Gantt的任务点击事件命名和dhtmlx Gantt不同，你要找的等价事件是onItemClick，使用方式如下：

1. 初始化时直接绑定事件 #

在Gantt初始化配置的on字段中添加监听，示例代码：

webix.ui({
  view: "gantt",
  id: "my_gantt",
  data: your_task_data,
  on: {
    onItemClick: function(taskId, event) {
      // 获取点击的任务完整数据
      const clickedTask = this.getItem(taskId);
      // 此处写你的自定义业务逻辑
      console.log("点击的任务：", clickedTask);
    }
  }
});

2. 运行时动态绑定事件 #

如果需要在Gantt初始化完成后再添加点击监听，可以用attachEvent方法：

$$("my_gantt").attachEvent("onItemClick", function(taskId, event) {
  const clickedTask = this.getItem(taskId);
  // 自定义逻辑
});

补充说明 #

• 如果需要区分点击的是左侧任务表格还是右侧时间线的任务条，可以通过第二个event参数判断触发元素的类名，只需要匹配webix_gantt_task_bar类就可以限定仅点击任务条时触发逻辑。
• 如果需要阻止点击任务默认触发的选中高亮行为，在事件回调末尾返回false即可。

内容的提问来源于stack exchange，提问作者Peter