wrapup-webbuilder
Version:
A web builder for downloading browser wrapup'd JavaScript
67 lines (58 loc) • 2.17 kB
HTML
<html>
<head>
<meta charset="utf-8">
<title>CodeMirror: Close-Tag Demo</title>
<link rel="stylesheet" href="../lib/codemirror.css">
<script src="../lib/codemirror.js"></script>
<script src="../lib/util/closetag.js"></script>
<script src="../mode/xml/xml.js"></script>
<script src="../mode/javascript/javascript.js"></script>
<script src="../mode/css/css.js"></script>
<script src="../mode/htmlmixed/htmlmixed.js"></script>
<link rel="stylesheet" href="../doc/docs.css">
<style type="text/css">
.CodeMirror {border-top: 1px solid #eee; border-bottom: 1px solid #eee;}
</style>
</head>
<body>
<h1>Close-Tag Demo</h1>
<ul>
<li>Type an html tag. When you type '>' or '/', the tag will auto-close/complete. Block-level tags will indent.</li>
<li>There are options for disabling tag closing or customizing the list of tags to indent.</li>
<li>Works with "text/html" (based on htmlmixed.js or xml.js) mode.</li>
<li>View source for key binding details.</li>
</p>
<form><textarea id="code" name="code"></textarea></form>
<script type="text/javascript">
var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
mode: 'text/html',
//closeTagEnabled: false, // Set this option to disable tag closing behavior without having to remove the key bindings.
//closeTagIndent: false, // Pass false or an array of tag names to override the default indentation behavior.
extraKeys: {
"'>'": function(cm) { cm.closeTag(cm, '>'); },
"'/'": function(cm) { cm.closeTag(cm, '/'); }
},
/*
// extraKeys is the easier way to go, but if you need native key event processing, this should work too.
onKeyEvent: function(cm, e) {
if (e.type == 'keydown') {
var c = e.keyCode || e.which;
if (c == 190 || c == 191) {
try {
cm.closeTag(cm, c == 190 ? '>' : '/');
e.stop();
return true;
} catch (e) {
if (e != CodeMirror.Pass) throw e;
}
}
}
return false;
},
*/
wordWrap: true
});
</script>
</body>
</html>