ueditor 单独图片上传转载

浏览数：26 / 时间：2015年06月09日

<body>
<script type="text/javascript">
    //这个是图片上传的，网上还有附件上传的
    (function($) {
        var image = {
            editor: null,
            init: function(editorid, keyid) {
                var _editor = this.getEditor(editorid);
                _editor.ready(function() {
                    //设置编辑器不可用
                    _editor.setDisabled();
                    //隐藏编辑器，因为不会用到这个编辑器实例，所以要隐藏
                    _editor.hide();
                    //侦听图片上传
                    _editor.addListener(‘beforeInsertImage‘, function(t, args) {
                        //将地址赋值给相应的input
                        $("#" + keyid).val(args[0].src);
                    });
                });
            },
            getEditor: function(editorid) {
                this.editor = UE.getEditor(editorid);
                return this.editor;
            },
            show: function(id) {
                var _editor = this.editor;
                //注意这里只需要获取编辑器，无需渲染，如果强行渲染，在IE下可能会不兼容（切记）
                //和网上一些朋友的代码不同之处就在这里
                $("#" + id).click(function() {
                    //弹出图片上传的对话框
                    var image = _editor.getDialog("insertimage");
                    image.render();
                    image.open();
                });
            },
            render: function(editorid) {
                var _editor = this.getEditor(editorid);
                _editor.render();
            }
        };
        $(function() {
            image.init("myeditor", "upload");
            image.show("image");
        });
    })(jQuery);
</script>
<script type="text/javascript">
    //    必须有这个东西，不然，图片上传没法用。如果你独立上传图片，并且需要修改图片路径的话，你就模仿下面的代码
    var editor = UE.getEditor(‘myeditor‘, {
        imageUrl: "{:U(GROUP_NAME.‘/Cases/upload/‘)}",
        imagePath: "__ROOT__/Uploads/",
        imageManagerUrl: "{:U(GROUP_NAME.‘/cases/imagesManager/‘)}",
        imageManagerPath: "__ROOT__/"
    });
</script>

<form method=‘post‘ action=‘{:U(GROUP_NAME."/Cases/save")}‘ enctype="multipart/form-data">
    <table class="table">
        <tbody>
        <tr>
            <td class="title_td">标题：</td>
            <td class="input_td"><input type=‘text‘ name=‘title‘ style=‘width: 300px‘/></td>
        </tr>

        <tr>
            <td class="title_td">图片：</td>
            <td class="input_td">
                <input id="upload" name=‘upload‘ type="text" style=‘width: 300px‘ value=""/>
                <script id="myeditor"></script>
                <input type="button" id=‘image‘ value=‘上传图片‘/>

            </td>
        </tr>

        <tr>
            <td colspan="2">

                <input type=‘submit‘ value="提交保存"/></td>

        </tr>

        </tbody>
    </table>

</form>