没有在光标所在的位置输入字符答案

【问题标题】：The characters are not getting typed where the cursor is没有在光标所在的位置输入字符
【发布时间】：2021-01-06 20:57:54
【问题描述】：

在我的 Ace 编辑器中，就在滚动条出现之后，字符正在输入，但光标所在的位置却没有。见下图。出了什么问题？该代码在我的开发环境中似乎可以正常工作。

我注意到我的开发环境的字体比我的生产环境的字体大。

开发环境：

产品环境：

我不明白为什么会有差异，以及这是否是问题的原因。

将fonts显式设置为courier new后，编辑器选项为

editor options are   {selectionStyle: "line", highlightActiveLine: true, highlightSelectedWord: true, readOnly: false, copyWithEmptySelection: false, …}animatedScroll: falseautoScrollEditorIntoView: undefinedbehavioursEnabled: truecopyWithEmptySelection: falsecursorStyle: "ace"displayIndentGuides: truedragDelay: 0dragEnabled: trueenableBlockSelect: trueenableMultiselect: truefadeFoldWidgets: falsefirstLineNumber: 1fixedWidthGutter: undefinedfocusTimeout: 0foldStyle: "markbegin"fontFamily: "Courier New"fontSize: "14pt"hScrollBarAlwaysVisible: falsehasCssTransforms: undefinedhighlightActiveLine: truehighlightGutterLine: truehighlightSelectedWord: trueindentedSoftWrap: truekeyboardHandler: undefinedmaxLines: undefinedmaxPixelHeight: 0mergeUndoDeltas: trueminLines: undefinedmode: "ace/mode/html"navigateWithinSoftTabs: falsenewLineMode: "auto"overwrite: falseplaceholder: undefinedprintMargin: 80printMarginColumn: 80readOnly: falserelativeLineNumbers: undefinedscrollPastEnd: 0scrollSpeed: 2selectionStyle: "line"showFoldWidgets: trueshowGutter: trueshowInvisibles: falseshowLineNumbers: trueshowPrintMargin: truetabSize: 4theme: "ace/theme/eclipse"tooltipFollowsMouse: trueuseSoftTabs: trueuseTextareaForIME: trueuseWorker: truevScrollBarAlwaysVisible: falsewrap: "off"wrapBehavioursEnabled: true__proto__: Object

更新

似乎编辑器中的每一行都有一个类ace_gutter-cell。此类与dev 和prod 环境不同。 prod 中缺少 position:absolute。请参阅下面的图片。我是否选择了 ace 的不同版本？

开发人员：

产品：

【问题讨论】：

标签： ace-editor

【解决方案1】：

当您使用非等宽字体时会发生这种情况；您必须在 Ace 中使用等宽字体。

【讨论】：

我添加了这个，但问题仍然存在this.editor.setOptions({ readOnly: this.readonlyFormStatus, fontFamily: "Courier New", fontSize: "14pt" });。我想Courier New 是等宽字体。
我注意到，如果没有文本，那么行号。 1 出现在排水沟中。假设我在第 1 行输入 a。 1 并按回车键，然后按行号。在装订线中更改为 2。现在我在第 2 行输入 b 并按 Enter。新行号是 3。现在，如果我使用向上箭头转到第 1 行，那么第 1 行。当我到达 1 时，of 2 从 2 变为 3。如果我现在向下移动一站去 2 号线，那么第 2 行。 2 正确地从 3 变回 2！由于某种原因，这仅在生产版本中发生。
var options = editor.getOptions() 将为您提供所有设置。它可能会给你一些线索
试过了。选项显示字体为Courier New。此外，开发和测试环境中的选项是相同的，但奇怪的是编辑器的工作方式完全不同。我已经用getOptions 的输出更新了这个问题
也许页面中有一些 CSS 改变了编辑器样式。有没有办法让我分享有错误的页面供我调试，或者创建一个演示页面？