Browse: Home » 【Javascript】textareaをコードエディタにするJSライブラリ。

【Javascript】textareaをコードエディタにするJSライブラリ。

いいものみつけたのでメモ。

http://codemirror.net/

ちょっといじくってみたけど設定やAPIも豊富でかなり便利な印象。

上記のURLから最新のソースをダウンロードして、ファイルを展開。

libの内容を全て読み込み、themeの中から好きなテーマを選択、そしてmodeの中から適用させたいプログラミング言語を選択してよみこみめば準備は完了。

あとは下記のように実行すれば良い。

■HTML

<textarea id="editor"></textarea>

■Javascript

CodeMirror.fromTextArea(document.getElementById('editor'), {
    mode: 'application/x-httpd-php',
    theme: 'lesser-dark',
    indentUnit: 4,
    indentWithTabs: false,
    tabMode: 'shift',
    enterMode: 'keep',
    electricChars: false,
    lineNumbers: true,
    firstLineNumber: 1,
    gutter: false,
    fixedGutter:false,
    matchBrackets: true
});

更なる細かいオプションなどは公式ドキュメントを参照されたし。

ちなみにGithubのリポジトリは以下。

https://github.com/marijnh/codemirror

 

2013/11/11 _onichannn , ,