codeMirror支持sql输入提示
2017-08-15 12:48
399 查看
codeMirror 是一款非常不错的在线代码编辑插件。现在简单介绍对sql编辑的支持。
初始化(function (){ window.top._editor = CodeMirror.fromTextArea($("#codeTypeArea")[0], { mode: 'text/x-sql', indentWithTabs: true, smartIndent: true, lineNumbers: true, matchBrackets: true, autofocus: false, styleSelectedText: true, extraKeys: { "'a'": completeAfter, "'b'": completeAfter, "'c'": completeAfter, "'d'": completeAfter, "'e'": completeAfter, "'f'": completeAfter, "'g'": completeAfter, "'h'": completeAfter, "'i'": completeAfter, "'j'": completeAfter, "'k'": completeAfter, "'l'": completeAfter, "'m'": completeAfter, "'n'": completeAfter, "'o'": completeAfter, "'p'": completeAfter, "'q'": completeAfter, "'r'": completeAfter, "'s'": completeAfter, "'t'": completeAfter, "'u'": completeAfter, "'v'": completeAfter, "'w'": completeAfter, "'x'": completeAfter, "'y'": completeAfter, "'z'": completeAfter, "'.'": completeAfter, "'='": completeIfInTag, // , // "Ctrl-Space": "autocomplete", "Ctrl-Enter": "autocomplete", Tab: function(cm) { var spaces = Array(cm.getOption("indentUnit") + 1).join(" "); cm.replaceSelection(spaces); } } }); function completeIfInTag(cm) { return completeAfter(cm, function() { var tok = cm.getTokenAt(cm.getCursor()); if (tok.type == "string" && (!/['"]/.test(tok.string.charAt(tok.string.length - 1)) || tok.string.length == 1)) return false; var inner = CodeMirror.innerMode(cm.getMode(), tok.state).state; return inner.tagName; }); } function completeAfter(cm, pred) { var cur = cm.getCursor(); if (!pred || pred()) setTimeout(function() { if (!cm.state.completionActive) cm.showHint({ completeSingle: false }); }, 100); return CodeMirror.Pass; } window.top._editor.on('change', function() { }); window.top._editor.setSize("100%",110); window.top._editor.refresh();//动态设置或浏览器变动后保证editor的正确显示 })()
mode:对某种语言的支持,我们这里选择SQL。更多语言支持参考官网
文件引入:codemirror.js、placeholder.js、sql.js、show-hint.js、sql-hint.js、show-hint.css、codemirror.css。主框架(codemirror.js)需最先引入。
试试吧!
配置信息官网很全。
相关文章推荐
- Sqlserver2005在安装过程中,提示“ [Microsoft][SQL Native Client]客户端不支持加密”解决办法
- 让EditPlus支持SQL高亮提示
- android AutoCompleteTextView 实现输入提示,类似百度支持输入拼音提示中文(gray)
- Sqlserver:sqlserver2005在安装过程中,提示“ [Microsoft][SQL Native Client]客户端不支持加密”的问题解决
- AutoCompleteTextView输入汉字拼音首字母实现过滤提示(支持多音字)2
- PL/SQL Developer中输入SQL语句时如何自动提示字段
- 我的Android进阶之旅------>Android之AutoCompleteTextView输入汉字拼音首字母实现过滤提示(支持多音字)
- AutoCompleteTextView输入汉字拼音首字母实现过滤提示(支持多音字,Filterable的使用)
- 我的Android进阶之旅------>Android之AutoCompleteTextView输入汉字拼音首字母实现过滤提示(支持多音字)
- AutoCompleteTextView输入汉字拼音首字母实现过滤提示(支持多音字)
- AutoCompleteTextView输入汉字拼音首字母实现过滤提示(支持多音字)
- SQL2005附加数据库,提示 数据库 版本为655,无法打开,此服务器支持611版...
- 文本框输入下拉智能提示---sql
- AutoCompleteTextView输入汉字拼音首字母实现过滤提示(支持多音字)
- SQL/PLUS创建JAVA SOURCE的问题,&符号提示输入内容
- AutoCompleteTextView输入汉字拼音首字母实现过滤提示(支持多音字)2
- Sqlplus登录时出现无法定位程序输入点longjmp于动态链接库的错误提示
- PB编译提示:DBMS MSS Microsoft SQL Server 6.0不支持当前安装的解决方法
- 在ASP.NET MVC中使用typeahead.js支持预先输入,即智能提示