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

Wilson.Zhang

本帖最后由葡萄藤002 于 2024-9-25 11:02 编辑

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

Wilson.Zhang · Wilson.Zhang

本帖最后由 Wilson.Zhang 于 2024-9-25 17:24 编辑

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

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

葡萄藤002 · 葡萄藤002

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

Wilson.Zhang · Wilson.Zhang

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

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

葡萄藤002 · 葡萄藤002

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)

Wilson.Zhang · Wilson.Zhang

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

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

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

复制代码

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

可以参考附件中的demo。

葡萄藤002 · 葡萄藤002

本帖最后由葡萄藤002 于 2024-9-25 16:16 编辑

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

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

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

Wilson.Zhang · Wilson.Zhang

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

不客气。

葡萄藤002 · 葡萄藤002

本帖最后由葡萄藤002 于 2024-9-25 16:53 编辑

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);
      }

葡萄藤002 · 葡萄藤002

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

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

		自动登录	找回密码
密码			立即注册

[已处理] 14版本的spreadJS ctrl F 调用查找功能

最佳答案

12 个回复