Codemirror 自动完成对 javascript 不起作用

问题描述

我正在尝试使用 Codemirror 在 JavaScript 中制作代码编辑器。我想要自动完成功能,但它不起作用。有人可以告诉我我在这里做错了什么。

代码如下:

var editor = CodeMirror.fromTextArea(myTextarea,{
  lineNumbers: true,extraKeys: {
    "Tab": "autocomplete"
  },hint: CodeMirror.hint.javascript
});
<head>
  <Meta charset="UTF-8">
  <Meta name="viewport" content="width=device-width,initial-scale=1.0">
  <script src="https://codemirror.net/lib/codemirror.js"></script>
  <script src="https://codemirror.net/mode/javascript/javascript.js"></script>
  <script src="https://codemirror.net/addon/hint/show-hint.js"></script>
  <script src="https://codemirror.net/addon/hint/anyword-hint.js"></script>
  <link rel="stylesheet" href="https://codemirror.net/lib/codemirror.css">
  <link rel="stylesheet" href="https://codemirror.net/addon/hint/show-hint.css">
  <title>Code</title>
</head>

<body>
  <textarea name="myTextarea" id="myTextarea" cols="30" rows="10"></textarea>

  </script>

解决方法

经过大量的研究,比如检查他们的网站示例和内容,我终于找到了一个可行的解决方案,代码如下:

 var editor = CodeMirror.fromTextArea(myTextarea,{
    lineNumbers: true,extraKeys: {"Ctrl-Space": "autocomplete"},mode: {name: "javascript",globalVars: true}
  });
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1.0">
  <link rel="stylesheet" href="https://codemirror.net/lib/codemirror.css">
  <link rel="stylesheet" href="https://codemirror.net/addon/hint/show-hint.css">
  <script src="https://codemirror.net/lib/codemirror.js"></script>
  <script src="https://codemirror.net/addon/hint/show-hint.js"></script>
  <script src="https://codemirror.net/addon/hint/javascript-hint.js"></script>
  <script src="https://codemirror.net/mode/javascript/javascript.js"></script>
  <script src="https://codemirror.net/mode/markdown/markdown.js"></script>
  <title>Code</title>
</head>

<body>
  <textarea name="myTextarea" id="myTextarea" cols="30" rows="10"></textarea>
</body>

</html>