ueditor插入自定義內容和樣式

UEditor是由百度web前端研發部開發所見即所得富文本web編輯器，具有輕量，可定制，注重用戶體驗等特點

 

通過UEditor提供的API接口可以很方便的讀寫操作內容並設置編輯器里的樣式

 

頁面中的腳本

<script>
    $(function () {
        init();
        _template();
    });
    function _template() {
        var html = '<ul><li>大因雲屏</li><li>超高分GIS地圖</li><li>KVM操作</li><li>高清輸入節點</li><li>智能音箱系統</li><li>智能會議交互終端</li></ul><p class="foot"><img src="/public/images/pic10.jpg"></p><h1>指揮中心解決方案系統圖</h1><img src="/public/images/pic11.jpg"><h1>大因雲屏與傳統系統對比圖</h1><img src="/public/images/pic13.jpg">';
        if (windw.editorcontent && editorcontent.setContent) {
            editorcontent.setContent(html);//插入自定義內容到編輯器
            editorcontent.document.body.className += ' content ';
        }
    }
    //初始化
    function init() {
        //加載ueditor腳本
        editorcontent = new baidu.editor.ui.Editor();
        editorcontent.render('content');//content為id號
        try {
            //添加自定義類名content,用於設置編輯器里的樣式
            editorcontent.addListener('ready', function (editor) {
                (editorcontent.document.body.className += ' content ')
            });
            editorcontent.sync();
        } catch (err) {}
    }
    </script>

　　

 

\js\ueditor\themes\iframe.css 自定義編輯器里的樣式

/*可以在這里添加你自己的css*/
.content {
    padding: 20px;
    background: #f6f6f6;
}
.content img {
    width: 98%;
}

 

 

 

 

參考：

UEditor API:ready

From WizNote