单独调用百度编辑器UEditor视频上传组件的代码

有一个单独的视频设置字段,需要视频上传的功能,自己编写相关代码太麻烦,那么可以通过单独调用 UEditor 编辑器的视频上传组件来实现。

HTML代码

<div class="uploadvideo">
	<input name="video" id="video" type="text" class="uplod_video" value="" />	
	<span class="btn">上传视频</span>	
</div>

引用UEditor编辑器相关文件

<!-- 配置文件 -->
<script src="ueditor.config.js"></script>
<!-- 编辑器源码文件 -->
<script src="ueditor.all.js"></script>

添加自定义代码

var tddx = document.createElement('script');
$(tddx).attr('type','text/plain').attr('id','tddx_editor');
$('body').append(tddx);
_editor = UE.getEditor('tddx_editor');
_editor.ready(function () {
    _editor.hide();
    $('.uploadvideo .btn').click(function(){        
        object = $(this).parent().find('.uplod_video');
        _editor.getDialog("insertvideo").open();
        _editor.addListener('beforeinsertvideo', function (t, arg) {
            console.log(arg[0].url);
            object.attr("value", arg[0].url);
        });
    });
});

举一反三,还可以调用图片上传组件等。

百度编辑器官方文档:http://fex.baidu.com/ueditor/

关键词: UEditor