cthep-ui-vue3
Version:
Vue 3 试题组件库
111 lines (108 loc) • 3.65 kB
HTML
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit">
<link rel="stylesheet" href="kityformula/assets/styles/base.css">
<link rel="stylesheet" href="kityformula/assets/styles/ui.css">
<link rel="stylesheet" href="kityformula/assets/styles/scrollbar.css">
<style>
html, body {
padding: 0;
margin: 0;
}
.kf-editor {
width: 780px;
height: 380px;
}
#loading {
height: 32px;
width: 340px;
line-height: 32px;
position: absolute;
top: 42%;
left: 50%;
margin-left: -170px;
font-family: arial, "Hiragino Sans GB", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
}
#loading img {
position: absolute;
}
#loading p {
display: block;
position: absolute;
left: 40px;
top: 0px;
margin: 0;
}
</style>
<title></title>
</head>
<body>
<div id="kfEditorContainer" class="kf-editor">
<div id="tips" class="tips">
sorry! Beta版本仅支持IE9及以上版本的浏览器，正式版本将会支持低版本浏览器，谢谢您的关注！
</div>
</div>
<script src="kityformula/js/jquery-3.6.0.min.js"></script>
<script src="kityformula/js/kitygraph.all.js"></script>
<script src="kityformula/js/kity-formula-render.all.js"></script>
<script src="kityformula/js/kity-formula-parser.all.min.js"></script>
<script src="kityformula/js/kityformula-editor.all.min.js"></script>
<script>
//获取url地址栏传参
function getQueryVariable(variable){
var query = window.location.search.substring(1);
var vars = query.split("&");
for (var i=0;i<vars.length;i++) {
var pair = vars[i].split("=");
if(pair[0] == variable){return pair[1];}
}
return(false);
}
//处理TinyMCE编辑器的事件
window.addEventListener('message', function (event) {
var data = event.data;
kfe.execCommand('get.image.data', function(data){
var latex = kfe.execCommand('get.source');
window.parent.postMessage({
mceAction: 'insertContent',
content: "<img src=\""+data.img+"\" data-latex=\""+latex+"\">"
}, '*');
window.parent.postMessage({
mceAction: 'close'
}, '*');
});
});
//实例化编辑器
jQuery( function ($) {
if ( document.body.addEventListener ) {
$( "#tips").html('<div id="loading"><img src="kityformula/loading.gif" alt="loading" /><p>正在加载，请耐心等待...</p></div>' );
var factory = kf.EditorFactory.create( $( "#kfEditorContainer" )[ 0 ], {
render: {
fontsize: 24
},
resource: {
path: "./kityformula/resource/"
}
} );
factory.ready( function ( KFEditor ) {
$( "#tips").remove();
//处理地址栏的参数并加载到编辑器中
var c=getQueryVariable("c")
if(c){
this.execCommand( "render",decodeURIComponent(c) );
}else{
this.execCommand( "render","\\placeholder" );
};
this.execCommand( "focus" );
window.kfe = this;
} );
} else {
$( "#tips").css( "color", "black" );
$( "#tips").css( "padding", "10px" );
}
} );
</script>
</body>
</html>