Kindeditor視頻上傳問題處理


 初始的時候,video這個標簽kindeditor是不識別的,只要html處理或者全屏的時候,都會被排除掉。如果想要video存在,則需要設置屬性filterMode :false

如果只是想要某個標簽或者屬性不被過濾,則需要在下面圖1中,htmlTags中進行添加

因為想要在web編輯的時候,就能夠展示視頻,所以干脆將kindeditor中html的添加的方法進行了一些修改,至於百度上其他人說的加什么插件之類的,感覺有點煩,而且由於網站需要手機端顯示,所以就直接把kindeditor.js改動了。

紅色部分代碼為新增代碼(具體圖2),只處理mp4情況,具體需求具體修改。這里只處理mp4格式了。如果是mp4格式的文件,則添加的html內容直接使用video標簽插入了。

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>

 

 

                             圖1

 

                                  圖2

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM