ACE编辑器问题 - 编辑器选择的网页跳转

时间:2017-12-23 20:21:52

标签: javascript ace-editor

我在我的网页上使用Javascript中的漂亮ACE编辑器。但是,我遇到了一个我无法找到答案的问题。

有时当我在编辑器中选择文本(或者只是在编辑器中单击)时,网页会快速跳起几百个像素。我一直无法解决这个问题,但我发现了一些更有可能发生的情况:

  • 网页不是全屏
  • 我在页面上有多个ACE编辑器
  • ACE编辑器并非完全在视图中(部分内容在寡妇上方或下方滚动)

以下是一些截图,只是为了让您了解我的意思。

  1. Before I click in the editor...
  2. After I click in the editor...
  3. Scrolling down so you can see the editor again...
  4. 这几乎每次我在编辑器中单击时都会发生,直到我使用箭头键取消选择。

    我已经检查过以确保我使用的是最新版本的ACE,并尝试删除大部分操作它的额外Javascript。我唯一没有能够指出任何代码行是问题。如果我只有这个Javscript与编辑一起工作,就会发生这种情况。我已经系统地删除了所有内容,但它仍然可以。

    var validatorEditor = ace.edit("custom-validator-editor");
    validatorEditor.$blockScrolling = Infinity;
    validatorEditor.setTheme("ace/theme/xcode");
    validatorEditor.session.setMode({ path: "ace/mode/c_cpp", inline: true });
    validatorEditor.resize();
    
    var generatorEditor = ace.edit("output-generator-editor");
    generatorEditor.$blockScrolling = Infinity;
    // generatorEditor mode is set dynamically later on usually
    generatorEditor.setTheme("ace/theme/xcode");
    generatorEditor.resize();
    

    有任何想法或建议吗?

    谢谢!

1 个答案:

答案 0 :(得分:0)

经过几个小时的挖掘,我发现有些CSS导致了这个问题,即

.parent-div{
    transform: translateX(10%);
}

当你专注于它时,那里的任何值都会使编辑器跳转。