百度UEditor编辑器如何提交内容和从数据库取得内容修改

来源:未知 人浏览 2016.05.03

百度UEditor编辑器是一款比较实用的富文本编辑器,然后有些伙伴用的时候可能不知道如何使用~

下面就简单的贴一下代码


UEditor版本:1.4.3.2 PHP 版本,UTF-8版


编辑器内容提交


<div class="col-lg-10">
    <script id="editor" type="text/plain" name="content" style="width:1024px;height:500px;"></script>//内容显示
    <script type="text/javascript">
        var editor = new UE.ui.Editor();
        editor.render("textarea");
    </script>
</div


抓取旧文章编辑


//但是很多同学不知道应该写在哪里,小站是这样用的!!
 
<script id="editor" type="text/plain" name="content" style="width:1024px;height:500px;">
    <?php echo $_htmll['content'] ?>//旧文章内容
</script>
<script type="text/javascript">
    var editor = new UE.ui.Editor();
    editor.render("editor");
</script>


以上提交和抓去内容不要忘记贴上以下代码


<script type="text/javascript">
    /*$('#exitsub').click(function(){
        UE.getEditor('textarea').sync();
        $('#form').submit();
    })*/
    //实例化编辑器
    //建议使用工厂方法getEditor创建和引用编辑器实例,如果在某个闭包下引用该编辑器,直接调用UE.getEditor('editor')就能拿到相关的实例
    var ue = UE.getEditor('editor');
 
 
    function isFocus(e){
        alert(UE.getEditor('editor').isFocus());
        UE.dom.domUtils.preventDefault(e)
    }
    function setblur(e){
        UE.getEditor('editor').blur();
        UE.dom.domUtils.preventDefault(e)
    }
    function insertHtml() {
        var value = prompt('插入html代码', '');
        UE.getEditor('editor').execCommand('insertHtml', value)
    }
    function createEditor() {
        enableBtn();
        UE.getEditor('editor');
    }
    function getAllHtml() {
        alert(UE.getEditor('editor').getAllHtml())
    }
    function getContent() {
        var arr = [];
        arr.push("使用editor.getContent()方法可以获得编辑器的内容");
        arr.push("内容为:");
        arr.push(UE.getEditor('editor').getContent());
        alert(arr.join("\n"));
    }
    function getPlainTxt() {
        var arr = [];
        arr.push("使用editor.getPlainTxt()方法可以获得编辑器的带格式的纯文本内容");
        arr.push("内容为:");
        arr.push(UE.getEditor('editor').getPlainTxt());
        alert(arr.join('\n'))
    }
    function setContent(isAppendTo) {
        var arr = [];
        arr.push("使用editor.setContent('欢迎使用ueditor')方法可以设置编辑器的内容");
        UE.getEditor('editor').setContent('欢迎使用ueditor', isAppendTo);
        alert(arr.join("\n"));
    }
    function setDisabled() {
        UE.getEditor('editor').setDisabled('fullscreen');
        disableBtn("enable");
    }
 
    function setEnabled() {
        UE.getEditor('editor').setEnabled();
        enableBtn();
    }
 
    function getText() {
        //当你点击按钮时编辑区域已经失去了焦点,如果直接用getText将不会得到内容,所以要在选回来,然后取得内容
        var range = UE.getEditor('editor').selection.getRange();
        range.select();
        var txt = UE.getEditor('editor').selection.getText();
        alert(txt)
    }
 
    function getContentTxt() {
        var arr = [];
        arr.push("使用editor.getContentTxt()方法可以获得编辑器的纯文本内容");
        arr.push("编辑器的纯文本内容为:");
        arr.push(UE.getEditor('editor').getContentTxt());
        alert(arr.join("\n"));
    }
    function hasContent() {
        var arr = [];
        arr.push("使用editor.hasContents()方法判断编辑器里是否有内容");
        arr.push("判断结果为:");
        arr.push(UE.getEditor('editor').hasContents());
        alert(arr.join("\n"));
    }
    function setFocus() {
        UE.getEditor('editor').focus();
    }
    function deleteEditor() {
        disableBtn();
        UE.getEditor('editor').destroy();
    }
    function disableBtn(str) {
        var div = document.getElementById('btns');
        var btns = UE.dom.domUtils.getElementsByTagName(div, "button");
        for (var i = 0, btn; btn = btns[i++];) {
            if (btn.id == str) {
                UE.dom.domUtils.removeAttributes(btn, ["disabled"]);
            } else {
                btn.setAttribute("disabled", "true");
            }
        }
    }
    function enableBtn() {
        var div = document.getElementById('btns');
        var btns = UE.dom.domUtils.getElementsByTagName(div, "button");
        for (var i = 0, btn; btn = btns[i++];) {
            UE.dom.domUtils.removeAttributes(btn, ["disabled"]);
        }
    }
 
    function getLocalData () {
        alert(UE.getEditor('editor').execCommand( "getlocaldata" ));
    }
 
    function clearLocalData () {
        UE.getEditor('editor').execCommand( "clearlocaldata" );
        alert("已清空草稿箱")
    }
</script>


render方法就是把你的旧文本放到编辑器中

文章转载自:http://www.maibok.com/txtshar/2016/0503/60.html


星期三
15年12月16日
热门板块
windows 10下载设计软件下载PhotoShop CC文章分享Portraiture磨皮win10安装教程
热门下载
Lightroom 5.2官方中文版下载下载(

Lightroom 5.2官方中文版下载下载(

下载
PhotoShop CC下载官方正版可激活版本

PhotoShop CC下载官方正版可激活版本

下载