14版本的spreadJS ctrl F 调用查找功能

官网有这样一个方法
将快捷键绑定到命令
setShortcutKey
官网举例子如下  我试了一下不太行
spread.commandManager().setShortcutKey('navigationPageUp', GC.Spread.Commands.Key.up, false, false, false, false);

葡萄藤002 发表于 2024-9-25 16:47
在这demo基础上 加了一句 阻止浏览器默认事件的，
window.addEventListener('keydown', (e) => {
      ...

可以的，功能就很完美了。我们把代码整理了下，附上demo，以供参考。

监听window的 keydown倒是可以   但是监听window的话  按几次ctrl f 就会出现几个重叠的dialog

葡萄藤002 发表于 2024-9-25 10:31
监听window的 keydown倒是可以   但是监听window的话  按几次ctrl f 就会出现几个重叠的dialog

您好！请问下您需要通过改写ctrl+f快捷键实现怎样的功能效果呢？

Wilson.Zhang 发表于 2024-9-25 11:52
您好！请问下您需要通过改写ctrl+f快捷键实现怎样的功能效果呢？

其实就是官网例子中的按 ctrl+f  弹出那个查找框子这个功能，由于我们的版本问题 没有这个功能，所以需要加一下，最新版的是自带这个功能的。目前我是直接监听了键盘的keydown事件  然后直接执行var command = GC.Spread.Sheets.Designer.getCommand(GC.Spread.Sheets.Designer.CommandNames.FindDialogFind);
            command.execute(this.designer, null)

葡萄藤002 发表于 2024-9-25 13:05
其实就是官网例子中的按 ctrl+f  弹出那个查找框子这个功能，由于我们的版本问题 没有这个功能，所以需要 ...

我们在14.2.0版本试了下，可以实现，参考如下代码：

1. spread.commandManager().register('customGetFindDialogCmd',
   
2.     function CustomGetFindDialog() {
   
3.         //单击一个单元格，然后按Enter键
   
4.         var command = GC.Spread.Sheets.Designer.getCommand(GC.Spread.Sheets.Designer.CommandNames.FindDialogFind);
   
5.          command.execute(designer, null);
   
6.     }
   
7.             );
   
8.             //将创建的操作映射到回车键
   
9.             spread.commandManager().setShortcutKey('customGetFindDialogCmd', 70, true, false, false, false);

复制代码

如下动图所示，上述代码可以在SpreadJS中自定义ctrl+f快捷键调用查找对话框。


可以参考附件中的demo。

Wilson.Zhang 发表于 2024-9-25 15:42
我们在14.2.0版本试了下，可以实现，参考如下代码：

如下动图所示，上述代码可以在SpreadJS中自定义ct ...

谢谢啦，我试试你这个 我现在是监听的keydown事件 能实现 但是确实有点不合适。

葡萄藤002 发表于 2024-9-25 16:08
谢谢啦，我试试你这个 我现在是监听的keydown事件 能实现 但是确实有点合适。

不客气。

Wilson.Zhang 发表于 2024-9-25 16:22
不客气。

在这demo基础上 加了一句 阻止浏览器默认事件的，
window.addEventListener('keydown', (e) => {
        if (e.ctrlKey && (e.key === 'f' || e.key === 'F')) {
          e.preventDefault(); // 阻止默认的 Ctrl+F 行为
        }
      })，在吧你的demo加到键位那个地方。
然后又多判断了 如果查找弹框已经出现就不在执行 后续逻辑的代码：const dialogDom = document.getElementsByClassName('gc-sjsdesigner-dialog')[0]
          if (!dialogDom) {
            var command = GC.Spread.Sheets.Designer.getCommand(GC.Spread.Sheets.Designer.CommandNames.FindDialogFind);
            command.execute(That.designer, null);
          }

Wilson.Zhang 发表于 2024-9-25 10:04
可以的，功能就很完美了。我们把代码整理了下，附上demo，以供参考。

赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞赞