|
|
@ -136,16 +136,20 @@ code line
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</pre>
|
|
|
|
</pre>
|
|
|
|
|
|
|
|
|
|
|
|
<pre class="layui-code" lay-options="{about: 'About info'}">
|
|
|
|
<pre class="layui-code" lay-options="{about: 'AboutInfo'}">
|
|
|
|
About
|
|
|
|
About
|
|
|
|
</pre>
|
|
|
|
</pre>
|
|
|
|
|
|
|
|
|
|
|
|
<script src="../src/layui.js"></script>
|
|
|
|
<!-- 第三方语法高亮库 -->
|
|
|
|
<script src="https://cdn.staticfile.org/highlight.js/11.8.0/highlight.min.js"></script>
|
|
|
|
<script src="https://cdn.staticfile.org/highlight.js/11.8.0/highlight.min.js"></script>
|
|
|
|
<script src="https://cdn.staticfile.org/prism/1.29.0/prism.min.js"></script>
|
|
|
|
<script src="https://cdn.staticfile.org/prism/1.29.0/prism.min.js"></script>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- layui -->
|
|
|
|
|
|
|
|
<script src="../src/layui.js"></script>
|
|
|
|
<script>
|
|
|
|
<script>
|
|
|
|
layui.use(['code', 'dropdown'], function(){
|
|
|
|
layui.use(['code', 'dropdown'], function(){
|
|
|
|
var dropdown = layui.dropdown;
|
|
|
|
var dropdown = layui.dropdown;
|
|
|
|
|
|
|
|
var layer = layui.layer;
|
|
|
|
var $ = layui.$;
|
|
|
|
var $ = layui.$;
|
|
|
|
|
|
|
|
|
|
|
|
// return;
|
|
|
|
// return;
|
|
|
@ -173,6 +177,7 @@ layui.use(['code', 'dropdown'], function(){
|
|
|
|
};
|
|
|
|
};
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 创建实例
|
|
|
|
var codeInst = layui.code({
|
|
|
|
var codeInst = layui.code({
|
|
|
|
elem: '#test',
|
|
|
|
elem: '#test',
|
|
|
|
preview: true,
|
|
|
|
preview: true,
|
|
|
@ -183,12 +188,14 @@ layui.use(['code', 'dropdown'], function(){
|
|
|
|
// wordWrap: false, // 是否自动换行
|
|
|
|
// wordWrap: false, // 是否自动换行
|
|
|
|
lang: 'html',
|
|
|
|
lang: 'html',
|
|
|
|
highlighter: "hljs",
|
|
|
|
highlighter: "hljs",
|
|
|
|
/*codeRender: function (code, opts) {
|
|
|
|
// code: '<div class="layui-btn">初始按钮</div>',
|
|
|
|
|
|
|
|
/*codeRender: function (code, opts) { // 初始高亮
|
|
|
|
layui.link(themeData[1].link, 'layui-code-theme');
|
|
|
|
layui.link(themeData[1].link, 'layui-code-theme');
|
|
|
|
return hljs.highlight(code, {language: opts.lang}).value;
|
|
|
|
return hljs.highlight(code, {language: opts.lang}).value;
|
|
|
|
},*/
|
|
|
|
},*/
|
|
|
|
tools: [
|
|
|
|
tools: [
|
|
|
|
'full',
|
|
|
|
'full',
|
|
|
|
|
|
|
|
'window',
|
|
|
|
{
|
|
|
|
{
|
|
|
|
title: ['文字换行'],
|
|
|
|
title: ['文字换行'],
|
|
|
|
type: 'form',
|
|
|
|
type: 'form',
|
|
|
@ -244,19 +251,36 @@ layui.use(['code', 'dropdown'], function(){
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
{
|
|
|
|
|
|
|
|
title: ['编辑'],
|
|
|
|
|
|
|
|
type: 'edit',
|
|
|
|
|
|
|
|
event: function(obj) {
|
|
|
|
|
|
|
|
layer.prompt({
|
|
|
|
|
|
|
|
formType: 2,
|
|
|
|
|
|
|
|
value: obj.rawCode,
|
|
|
|
|
|
|
|
title: '编辑代码',
|
|
|
|
|
|
|
|
area: ['800px', '500px'],
|
|
|
|
|
|
|
|
maxlength: 9999999999
|
|
|
|
|
|
|
|
}, function(value, index) {
|
|
|
|
|
|
|
|
layer.close(index);
|
|
|
|
|
|
|
|
// 重载 code
|
|
|
|
|
|
|
|
codeInst.reloadCode({
|
|
|
|
|
|
|
|
code: value
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
]
|
|
|
|
]
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
// 仅重载 code
|
|
|
|
// 语法高亮重载
|
|
|
|
layui.debounce(function() {
|
|
|
|
codeInst.reloadCode({
|
|
|
|
codeInst.reloadCode({
|
|
|
|
codeRender: function(code, opts) {
|
|
|
|
codeRender: function(code, opts) {
|
|
|
|
layui.link(themeData[1].link, 'layui-code-theme');
|
|
|
|
layui.link(themeData[1].link, 'layui-code-theme');
|
|
|
|
return hljs.highlight(code, {language: opts.lang}).value;
|
|
|
|
return hljs.highlight(code, {language: opts.lang}).value;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
}, 300)();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 通用实例,根据元素属性定制化参数
|
|
|
|
// 通用实例,根据元素属性定制化参数
|
|
|
|