2017-11-09 26 views
0

작동하지 않는 모드 만 모드를 변경하는 경우가 작동하지 않습니다에이스 편집기 나 구문 강조 작업을 얻기 위해 노력하고

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.9/monokai.js"></script> 
    <script="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.9/mode-javascript.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.9/ace.js"></script> 
    <script src="scripts.js"></script> 

scripts.js는

var html = ace.edit("htmlEditor"); 
var css = ace.edit("cssEditor"); 
var js = ace.edit("jsEditor"); 

html.setTheme("ace/theme/monokai"); 
css.setTheme("ace/theme/monokai"); 
js.setTheme("ace/theme/monokai"); 

var JavaScriptMode = ace.require("ace/mode/javascript").Mode; 
js.session.setMode(new JavaScriptMode()); 

답변

1

당신은 당신의 HTML에 오타가 <script=" 또한 테마 및 모드 용 스크립트를 ace.js 뒤에 삽입해야합니다.

에이스에 이름을 전달하고 모드 및 테마를 단독으로로드하는 것이 더 좋습니다

,

<script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.9/ace.js"></script> 
 
<div id="htmlEditor">&lt;html&gt;</div> 
 
<div id="cssEditor">.css { color: red }</div> 
 
<div id="jsEditor">var js</div> 
 
<style> 
 
html, body { 
 
    height: 100%; 
 
} 
 
#htmlEditor, #cssEditor, #jsEditor { 
 
height:30% 
 
} 
 
</style> 
 
<script> 
 

 
var html = ace.edit("htmlEditor"); 
 
var css = ace.edit("cssEditor"); 
 
var js = ace.edit("jsEditor"); 
 

 
html.setTheme("ace/theme/monokai"); 
 
css.setTheme("ace/theme/monokai"); 
 
js.setTheme("ace/theme/monokai"); 
 

 
html.session.setMode("ace/mode/html"); 
 
css.session.setMode("ace/mode/css"); 
 
js.session.setMode("ace/mode/javascript"); 
 

 
</script>