4
<title>CodeMirror: Close-Tag Demo</title>
5
<link rel="stylesheet" href="../lib/codemirror.css">
6
<script src="../lib/codemirror.js"></script>
7
<script src="../lib/util/closetag.js"></script>
10
<script src="../mode/xml/xml.js"></script>
12
<script src="../mode/xml/xml.js"></script>
13
<script src="../mode/javascript/javascript.js"></script>
14
<script src="../mode/css/css.js"></script>
15
<script src="../mode/htmlmixed/htmlmixed.js"></script>
17
<script src="../mode/xmlpure/xmlpure.js"></script>
20
<link rel="stylesheet" href="../doc/docs.css">
21
<style type="text/css">
22
.CodeMirror {border-top: 1px solid #eee; border-bottom: 1px solid #eee;}
27
<h1>Close-Tag Demo</h1>
29
<li>Type an html tag. When you type '>' or '/', the tag will auto-close/complete. Block-level tags will indent.</li>
30
<li>There are options for disabling tag closing or customizing the list of tags to indent.</li>
31
<li>Works with "text/html" (based on htmlmixed.js or xml.js) and "xmlpure" modes.</li>
32
<li>View source for key binding details.</li>
35
<form><textarea id="code" name="code"></textarea></form>
37
<script type="text/javascript">
38
var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
42
//closeTagEnabled: false, // Set this option to disable tag closing behavior without having to remove the key bindings.
43
//closeTagIndent: false, // Pass false or an array of tag names to override the default indentation behavior.
46
"'>'": function(cm) { cm.closeTag(cm, '>'); },
47
"'/'": function(cm) { cm.closeTag(cm, '/'); }
51
// extraKeys is the easier way to go, but if you need native key event processing, this should work too.
52
onKeyEvent: function(cm, e) {
53
if (e.type == 'keydown') {
54
var c = e.keyCode || e.which;
55
if (c == 190 || c == 191) {
57
cm.closeTag(cm, c == 190 ? '>' : '/');
61
if (e != CodeMirror.Pass) throw e;
added
removed
demo/closetag.html
