JQuery和ACE-Editor不能很好地配合使用

JQuery and ACE-Editor not playing well together

本文关键字：很好 ACE-Editor 不能 JQuery 更新时间：2023-09-26

我正在构建一些模块来教我的一些学生介绍编码概念http://jsbin.com/pacaxoza/3/edit

当用户编写自己的函数时，我希望编辑器在调用时跳转到函数时突出显示每行，以便用户可以看到他们的函数在调用时被读取。所有这些都在上面的jsbin中(基于代码的动画画布没有在jsbin中)。

在Javascript模式下，Ace Editor将所有用户定义的函数用class'ace_function'包围在一个span中。我找不到一种简单的方法来查找和存储用户在ace方法中创建的函数的值，所以我使用JQuery来查找类'ace_function'的每个跨度。我使用JQuery索引来查找这些函数所在的行，然后将该信息传递给ace方法以呈现。

问题是，如果编辑器滚动到顶部，一切都很好，但如果你在编辑器中向下滚动并点击提交，编辑器的索引似乎被几行代码所关闭，一切都崩溃了。

有没有人有更好的方法来解决这个问题，或者是什么导致了不稳定的行为?

谢谢

Ace使用虚拟视口并仅为可见行创建dom元素，因此使用jquery将不起作用。
您需要使用Ace api代替，session.getLine(number)->string, session.getTokens(number)->[{type, value}, ...]。
tokenIterator也可能很有用，参见https://github.com/ajaxorg/ace/blob/master/lib/ace/edit_session/bracket_match.js#L34查看示例