初始的时候,video这个标签kindeditor是不识别的,只要html处理或者全屏的时候,都会被排除掉。若是想要video存在,则须要设置属性filterMode :falsejavascript
若是只是想要某个标签或者属性不被过滤,则须要在下面图1中,htmlTags中进行添加html
由于想要在web编辑的时候,就可以展现视频,因此干脆将kindeditor中html的添加的方法进行了一些修改,至于百度上其余人说的加什么插件之类的,感受有点烦,并且因为网站须要手机端显示,因此就直接把kindeditor.js改动了。java
红色部分代码为新增代码(具体图2),只处理mp4状况,具体需求具体修改。这里只处理mp4格式了。若是是mp4格式的文件,则添加的html内容直接使用video标签插入了。web
function _mediaImg(blankPath, attrs) {
...
//sldedit 20171129 将mp4格式直接使用video放置html,不过想使用mp4,须要将 filterMode :false,//不开启过滤
if (attrs.src.indexOf(".mp4")!=-1) {
var html = '<video controls="" width="100%" class="' + _mediaClass(type) + '" ';
html += '><source src="' + attrs.src + '" data-ke-src="'+attrs.src+'" >'
html += '</video>';
return html;
}
else {
var html = '<img class="' + _mediaClass(type) + '" src="' + blankPath + '" ';
if (style !== '') {
html += 'style="' + style + '" ';
}
html += 'data-ke-tag="' + escape(srcTag) + '" alt="" />';
return html;
}
}
<!--Kindeditor以及相应的操做-->
<script src="/assets/global/plugins/kindeditor/kindeditor.js" type="text/javascript"></script>
<script src="/assets/global/plugins/kindeditor/lang/zh_CN.js" type="text/javascript"></script>
<script type="text/javascript">
var introEditor;
KindEditor.ready(function (K) {
introEditor = K.create('[name=introduction_show]', {
minWidth: 400,
allowFileManager: true,
filterMode :false,//不开启过滤,所有不开启过滤使用false设置,若是是想要某个不过滤,则须要进入kindeditor.js进行修改
uploadJson: 'xxx',
afterBlur: function () {
this.sync();
$('#showrichtext').html($("[name=introduction_show]").val());
}
});
});
</script>
图1ide
图2网站