在本章节我们给websheet的右击菜单增加点击选项,下面例子增加了一个“自定义右击菜单”的选择。
首先建立自己需要展示的div,绑定你自定义的交互事件。下面的例子是动态建立,代码如下:
  let yourDiv = document.createElement('div');
  yourDiv.id = 'youDiv';
  yourDiv.innerText = '自定义右击菜单';
  yourDiv.className = 'fiss-rightMenu-Item'; //鼠标滑过的Css设置
  yourDiv.addEventListener('click', function (e) {
    let range=activeSheet.ActiveRange();
    let cell= activeSheet.GetCellValue(range); 
    console.log(cell.value);//打印激活单元格的值
  });
我们通过document.createElement创建了一个动态div,并给该DVI设置了id,展示的文本,css相关属性。然后我们给该div增加了单击事件,在该事件中我们获取了激活单元的内容,并且打印该内容。
有了定义完成的展示菜单DIV后就可以通过 wsheet.AddRightMenu将你的菜单注册到websheet中。
  
   wsheet.AddRightMenuSegment();//增加右击菜单的分割线 
  wsheet.AddRightMenu(yourDiv);
  
你也可以通过wsheet.AddRightMenuSegment增加定义好的菜单分割线。
  
   wsheet.AddRightMenuSegment();//增加右击菜单的分割线 

   let wsheet = new websheet('yourID', yourElement);
  /**
   * 第一步 获取激活sheet
   */
  let activeSheet = wsheet.ActiveSheet();
  activeSheet.SetCellValue('A3', '自定义右击菜单');
  /**
   * 第二步 定义自己的展示div,并添加到右击菜单
   */
  wsheet.AddRightMenuSegment();//增加右击菜单的分割线 
  let yourDiv = document.createElement('div');
  yourDiv.id = 'youDiv';
  yourDiv.innerText = '自定义右击菜单';
  yourDiv.className = 'fiss-rightMenu-Item';
  yourDiv.addEventListener('click', function (e) {
    let range=activeSheet.ActiveRange();
    let cell= activeSheet.GetCellValue(range); 
    console.log(cell.value);//打印激活单元格的值
  });
  wsheet.AddRightMenu(yourDiv);
  /**
   * 第三步   重新绘制表格
  */
  activeSheet.setColWidth(1, 160);
  activeSheet.setColWidth(2, 260);
  activeSheet.setColWidth(3, 160);
  activeSheet.setColWidth(4, 160);
  activeSheet.setColWidth(5, 160);
  wsheet.BuildSheet();
  wsheet.Draw();