現在、ace.jsを使ってチェックツールを作成しています。
なぜか、ace.jsが反映されなく、ソースコードのところにになにも出てきません。
最近、jsを始めたばっかりなので、丁寧に教えてくれるとありがたいです。よろしくお願いします。
表示画面
html
1<html> 2 <head> 3 <meta cherset="UTF-8"> 4 <title>ジャッジシステム</title> 5 </head> 6 <body> 7 <h1>コードをDockerコンテナで動かす</h1> 8 言語 9 <select id="language"> 10 <option value="ruby">Ruby</option> 11 <option value="python">Python</option> 12 </select> 13 <br/> 14 ソースコード:<br/> 15 <div id="source_code" style="width: 100%; height:50px; border: 1px solid;"></div> 16 標準入力:<br/> 17 <textarea id="input" style="width: 100%; height:50px; resize: vertical;"></textarea> 18 <br /> 19 20 <button id="run_button" class="btn btn-primary">実行(Ctrl-Enter)</button> 21 <br /> 22 <hr /> 23 24 標準出力: 25 <pre><div id="stdout" style="backgroud: lightgray"></div></pre> 26 27 標準エラー出力: 28 <pre><div id="stderr" style="backgroud: lightgray"></div></pre> 29 30 実行時間: 31 <div id="time" style="backgroud lightgray"></div> 32 33 終了コード: 34 <div id="exit_code" style="backgroud lightgray"></div> 35 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 36 <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2.3/ace.js"></script> 37 <script src="https://cdnjs.cloudflare.com/ajax/libs/ace/1.2./ext-language_tools.js"></script> 38 <script src="run.js"></script> 39 <script src="ui.js"></script> 40 </body> 41</html>
javascript
1 2var aceEditor = ace.edit("source_code"); 3 4//https://ace.c9.io/#nav=about 5aceEditor.setOptions({ 6 enableBasicAutocompletion: true, 7 enableLiveAutocompletion: true, 8 enableSnippets: true, 9}); 10 11$("#run_button").on("click",function(event){ 12 runCode(); 13}); 14 15aceEditor.commands.addCommand({ 16 bundKey: {win: "Ctrl-Enter",mac:"Ctrl-Enter"}, 17 exec: runCode, 18}); 19 20 21function setEditorLangeuage(language){ 22 var languageToMode = { 23 ruby: "ruby", 24 python: "python", 25 }; 26 var mode = languageToMode[language]; 27 aceEditor.getSession().setMode("ace/mode/"+mode); 28} 29 30$("#language").val("ruby"); 31setEditorLangeuage("ruby"); 32$("#language").on("change", function(event){ 33 setEditorLangeuage(this.value); 34}); 35
ご回答をお待ちしております。
よろしくお願いします。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。