勤勤学长

共同成长,共同思考

thinkphp5.0框架使用ueditor编辑器笔记

ueditor下载地址:http://ueditor.baidu.com/website/download.html (我下载的是完整版)

在public目录下放置解压出来的ueditor文件夹(什么都不用修改)

《thinkphp5.0框架使用ueditor编辑器笔记》

打开看自带的index.html

 

其中
<script id="editor" type="text/plain" style="width:1024px;height:500px;"></script> 就是编辑器的窗口,把内容加到script标签中间,加载js文件后再写js代码

《thinkphp5.0框架使用ueditor编辑器笔记》

我的提交是通过js,参考例程中的可知function getContent()就是获取编辑器内容,所以我们的submit()可以这样写

<button type="button" class="btn btn-secondary radius"  onclick="submit();">提交</button>
    function submit(){
        var arr = [];
        arr.push(UE.getEditor('editor').getContent());//这个是获取编辑器的内容
        var content = arr.join("\n");
		var title = $('#title').val();
			$.post("{:url('add')}",{
	        title:title,
	        content:content,
	        sort:$('#sort').val(),
	       	article:$('#goods_id').val()
		},
		function(data,status){
			alert(data);
			
		})

编辑器的配置在ueditor.config.js这个文件里修改。如果需要工具栏固定在一个地方,把autoFloatEnabled:true注释去掉

《thinkphp5.0框架使用ueditor编辑器笔记》

点赞