升级jQuery 3至TypeScript后设置ctrlKey触发事件遇TS2540错误如何解决？

这个问题是因为jQuery 3对应的TypeScript类型定义把ctrlKey、which这类事件属性标记为**只读（readonly）**了，而jQuery 2的类型定义没有这个限制。不过我们有几种靠谱的解决办法：

方法1：创建Event时直接传入配置（推荐） #

jQuery的$.Event()构造函数本身支持在第二个参数传入事件属性的配置对象，这也是官方推荐的方式，完全符合TypeScript的类型约束，代码更简洁：

const event = $.Event("keydown", { which: 77, ctrlKey: true });
$(window).trigger(event);

这样就不需要事后单独赋值，从根源上避免了类型报错。

方法2：通过类型断言绕过只读检查（仅当必须事后赋值时使用） #

如果你确实需要在创建Event对象后再修改属性，可以用类型断言告诉TypeScript你确认这些属性是可修改的：

方式A：断言为any #

这是最简单的方式，适合快速解决问题：

const event: JQuery.Event<HTMLElement, null> = $.Event("keydown");
(event as any).which = 77;
(event as any).ctrlKey = true;
$(window).trigger(event);

方式B：定义可修改的事件类型（更精确） #

如果你想保持类型的严谨性，可以自定义一个扩展接口，去掉只读限制：

interface MutableJQueryKeyboardEvent extends JQuery.Event<HTMLElement, null> {
  which: number;
  ctrlKey: boolean;
}

const event = $.Event("keydown") as MutableJQueryKeyboardEvent;
event.which = 77;
event.ctrlKey = true;
$(window).trigger(event);

这种方式比断言为any更安全，因为你明确指定了哪些属性是可修改的。

为什么会出现这个报错？ #

jQuery 3的TypeScript类型定义做了更严格的规范，把事件对象的原生属性（比如ctrlKey、which）标记为只读，因为在标准DOM事件中这些属性本来就是只读的。但jQuery的事件对象实际上允许修改这些属性用于触发模拟事件，所以类型定义和运行时行为存在一点差异，这就是报错的原因。

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