CodeMirror与jquery UI-Tabs混合使用 注意事项

简介:
第一步:.将代码高亮渲染
第二步:jquery Tab输出;
第三步:点击Tab切换时,将代码块刷新;

具体操作:
1.在jQuery tabs之前,创建CodeMirror实例:如:
var tocm = document.getElementById("codifyme"); 
$("#tabifyme").tabs();
CodeMirror.fromTextArea(tocm);

需将第三句与第二句位置互换,像下面这样:
vartocm=document.getElementById("codifyme"); 
CodeMirror.fromTextArea(tocm);
$("#tabifyme").tabs();



2.在点击jQuery tabs时,在Tab被激活时,刷新编辑器:
$("#tabifyme").tabs({
    activate:function(event,ui){
        // activate event is fired every time a tab is selected
        // refresh CodeMirror to ensure that its contents display correctly
        cminst.refresh();
    }
}); 
var tocm=document.getElementById("#codifyme");    
var cminst=CodeMirror.fromTextArea(tocm); 

摘自:http://jtmorris.net/2013/06/codemirror-editor-not-displaying-default-value/
目录
相关文章
|
4月前
|
JavaScript
jQuery学习(三)—jQuery使用步骤以及注意事项
jQuery学习(三)—jQuery使用步骤以及注意事项
|
9月前
|
JavaScript
jquery实现状态灯转换的注意事项
jquery实现状态灯转换的注意事项
23 0
|
JavaScript 前端开发 Web App开发
|
Web App开发 JavaScript 测试技术
JQuery选择器之[attribute^=value]使用注意事项
注意事项一: Firefox下JQuery选择器之[attribute^=value]使用注意事项 之前写的一个脚本中用到了 var bindAttrs = $("[databind^='attr'", item);大家都看出存在的问题了吧? 这脚本用了一段时间了,但一直没用Firefox下测试过, 在其它浏览器下都能正常使用! 今天突然有人发现在Firefox下加载的数据不正确, 经过一段时间的调试,最后发现是代码写的有问题, 犯了一个低级的错误,只写了左中括号,忘了写右中括号。
681 0
|
JavaScript PHP
jQuery get和post 方法传值注意事项
用 jQuery 的都知道,jQuery 的 get 和 post 方法有三个参数:地址,数据 和 回调函数,但我们知道地址也可以跟随数据的(形如:get_data.php?v1=1&v2=2),而且第二个参数可以省略,即第二个参数可以直接写回调函数,那么数据写在地址后面和写在 data 参数里有什...
831 0
|
Web App开发 JavaScript 前端开发
JQuery语法总结和注意事项
1、关于页面元素的引用   通过jquery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom或者xpath条件等方法,且返回的对象为jquery对象(集合对象),不能直接调用dom定义的方法。
720 0
|
6月前
|
JavaScript
Jquery插件知识之Jquery.cookie实现页面传值
Jquery插件知识之Jquery.cookie实现页面传值
36 0
|
7月前
|
JavaScript
jQuery 插件自用列表
jQuery 插件自用列表
29 0
|
3月前
|
JavaScript
jQuery图片延迟加载插件jQuery.lazyload
jQuery图片延迟加载插件jQuery.lazyload