1行高的CodeMirror实例

Question

我正在编写一个程序，该程序将使用CodeMirror实例并弹出一个小元素，您可以在其中输入文本。该文本输入区域应该高一行。 我将在与主CodeMirror实例相同的文本键入区域中做很多相同的事情，所以我只想使用CodeMirror的另一个实例，但是到目前为止我尝试过的一切都结束了太高了。

如何制作仅一行高且可水平滚动的CodeMirror实例？ 我想要没有行号，没有装订线等，仅是要输入文本的区域。

我尝试了几件事，包括此处的代码（全部或部分尝试了）： 仅用于一行文本字段的codemirror？ 。 该示例防止用户在代码镜像实例中键入多行代码，但并不仅限于此。 那里还有其他CodeMirror东西，尽管我不确定那里到底有什么或如何摆脱它。

编辑：回复：@rfornal的请求，这是我指的代码和解释（作者Tigran Saluev）：

嗯，有一种方法可以使用CodeMirror的丰富功能来制作单行编辑器。 首先，您必须添加功能齐全的CodeMirror对象（使用文本区域）。

假设您有var cm = CodeMirror（...）。 （使用值：“”）。 然后做

 cm.setSize(200, cm.defaultTextHeight() + 2 * 4); // 200 is the preferable width of text field in pixels, // 4 is default CM padding (which depends on the theme you're using) // now disallow adding newlines in the following simple way cm.on("beforeChange", function(instance, change) { var newtext = change.text.join("").replace(/\\n/g, ""); // remove ALL \\n ! change.update(change.from, change.to, [newtext]); return true; }); // and then hide ugly horizontal scrollbar cm.on("change", function(instance, change) { $(".CodeMirror-hscrollbar").css('display', 'none'); // (!) this code is using jQuery and the selector is quite imperfect if // you're using more than one CodeMirror on your page. you're free to // change it appealing to your page structure. }); // the following line fixes a bug I've encountered in CodeMirror 3.1 $(".CodeMirror-scroll").css('overflow', 'hidden'); // jQuery again! be careful with selector or move this to .css file 

这对我来说很好。

到目前为止，我尝试过的所有内容仍然比一行高。 可能有一种方法可以做到，我只是不了解如何。

Answer 1

像往常一样，这是用户错误。 我以为CodeMirror的样式会覆盖我为容器创建的任何样式，但事实并非如此。 我的样式感染了CodeMirror实例并引起了怪异。

特别：
-设置位置：相对位置不应该的位置（我不确定该在哪里）
-设置显示：在不应该出现的地方进行内联阻止（再次，不确定具体影响了什么）

我深表歉意，希望以后对其他人有帮助。