百度文本编辑器

百度文本编辑器的下载版本:需要引入ueditor.config.js和ueditor.all.min.js和lang/zh-cn/zh-cn.js

使用时将下载好的ueditor文件包放到www文件的目录下,并根据自己的需要选择以下的按钮

以下是html代码部分:

 

新建与ueditor同级的文件testueditor.php:进行自己的操作

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
    <script type="text/javascript" charset="utf-8" src="ueditor/utf8-php/ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="ueditor/utf8-php/ueditor.all.min.js"> </script>
    <!--建议手动加在语言,避免在ie下有时因为加载语言失败导致编辑器加载失败-->
    <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型,比如你在配置项目里配置的是英文,这里加载的中文,那最后就是中文-->
    <script type="text/javascript" charset="utf-8" src="ueditor/utf8-php/lang/zh-cn/zh-cn.js"></script>

</head>

<body>
<div>
    <h1>完整demo</h1>
    <script id="editor" type="text/plain" style="width:800px;height:300px;"></script>
</div>
<div>
    <button onclick="getContent()">获得内容</button>
    <button onclick="setContent()">写入内容</button>
</div>
<div id="xianshi"></div>
</body>
<script type="text/javascript">
    var ue = UE.getEditor(‘editor‘);
    function getContent() {

      document.getElementById("xianshi").innerHTML = UE.getEditor(‘editor‘).getContent();

    }
    function setContent(isAppendTo) {

        var str = "<p>我看看是不是能行的,就是这么好会说话</p><p><img src=‘/ueditor/php/upload/image/20160625/1466820882121569.png‘ title=‘1466820882121569.png‘ alt=‘logo.png‘></p>";

        UE.getEditor(‘editor‘).setContent(str, isAppendTo);

    }
</script>
</html> 
时间: 2024-10-09 01:40:06

百度文本编辑器的相关文章

6月21 百度文本编辑器

百度文本编辑器的下载版本:需要引入ueditor.config.js和ueditor.all.min.js和lang/zh-cn/zh-cn.js 使用时将下载好的ueditor文件包放到www文件的目录下,并根据自己的需要选择以下的按钮 以下是html代码部分: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd&quo

SpringBoot2 整合 JSP视图模板 整合 Ueditor富文本编辑器

一般涉及到后台管理系统,就少不了富文本编辑器,这个可以图文视频混排高级工具,笔者通过对比,发现目前市场上最好的三方库还当属百度的 ueditor 近年来 SpringBoot 框架可谓越来越火,可是笔者发现 ueditor 只提供了对于 JSP 的版本,网上能找到很多继承的案列,但是大部分都是修改源码,或者 自己去实现上传文件的接口这使得一些功能不能被使用或者需要花大量的事件去实现上传文件的方法,通过权衡,还是 springboot + jsp + ueditor 的方式最简单 虽然 jsp 不

UEditor百度富文本编辑器--让编辑器自适应宽度的解决方案

UEditor百度富文本编辑器的initialFrameWidth属性,默认值是1000. 不能够自适应屏幕宽度.如图1: 刚开始的时候,我是直接设置initialFrameWidth=null的.效果如图2: 这样子UEditor百度富文本编辑器会在第一次加载的时候获取屏幕宽度,然后赋值给initialFrameWidth属性. 这样子确实是可以在第一次加载的时候适应屏幕宽度,但是却似乎宽度稍微过了一点点,超过上面的灰条了.而且这里还有一个问题: 当你改变浏览器大小时,会有个很严重的排版BUG

MVC使用百度开源文本编辑器UEditor实现图文并茂,字数限制,上传图片或涂鸦

原文:MVC使用百度开源文本编辑器UEditor实现图文并茂,字数限制,上传图片或涂鸦 文本编辑器有很多,比如ticymce和CKEditor就比较好用,但涉及到图片.文件上传,需要结合CKFinder实现,而且有些功能是收费的,即使有意付费使用, 支付也不方便.好在百度的开源文本编辑器UEditor现在也发展得不错,本篇就来体验其在MVC中的使用.需要实现如下效果: 1.上传图片2.上传涂鸦3.字数限制 4.另一视图页图文显示 首先到这里下载UEditor的.NET版本,我下载的是[1.4.3

PHP接入umeditor(百度富文本编辑器)

2015年6月28日 23:08:49 星期日 效果: 开搞;) 首先: 百度官网上下载 umeditor 简版的富文本编辑器(这里) 然后: 解压放到自己的项目中, 配置服务器, 保证能在浏览器端加载到js,css,image... 最后: 准备好上传图片的程序, 我这里是用PHP直接上传到了七牛上 html (在第24~32行, 初始化一些配置, 不用去修改umeditor.config.js了) 1 <!DOCTYPE HTML> 2 <html> 3 <head>

Django集成百度富文本编辑器uEditor

UEditor是由百度web前端研发部开发所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码. 首先从ueEditor官网下载最新版本的包,目前官网上提供了ASP..NET.PHP.JSP版本的,django版本只有一个第三方个人开发的,但看上出配置起来稍微复杂一点. 这里不介绍uEditor的使用方法,也不过多解释uEditor的配置方法,官网上都有详细的文档和API介绍,下载的Demo中也有常用的方法的示例代码,这里主要介绍uEdi

百度副文本编辑器自动缩放上传的图片

在使用百度副文本编辑器的时候出现一个很苦恼的bug: 上图: 就是图片太大,超出了评论框,这其中css和html写的不大合理有关外,还有副文本编辑器没有做处理: 处理方法: 1.来到副文本编辑器的themes文件夹内: 2.修改iframe.css文件 3.在该文件里面编辑以下代码: img { max-width: 100%; /*图片自适应宽度*/ } body { overflow-y: scroll !important; } .view { word-break: break-all;

[转]UEditor百度富文本编辑器--让编辑器自适应宽度的解决方案

转自http://www.cnblogs.com/VAllen/p/UEditor-InitialFrameWidth-Auto.html UEditor百度富文本编辑器的initialFrameWidth属性,默认值是1000. 不能够自适应屏幕宽度.如图1: 刚开始的时候,我是直接设置initialFrameWidth=null的.效果如图2: 这样子UEditor百度富文本编辑器会在第一次加载的时候获取屏幕宽度,然后赋值给initialFrameWidth属性. 这样子确实是可以在第一次加

ASP.NET MVC5 中百度ueditor富文本编辑器的使用

随着网站信息发布内容越来越多,越来越重视美观,富文本编辑就是不可缺少的了,众多编辑器比较后我选了百度的ueditor富文本编辑器. 百度ueditor富文本编辑器分为两种一种是完全版的ueditor,另一种是ueditor的迷你版umeditor. 一.我们先讲完全版的ueditor. 1.建立数据模型. 2.建立对应的控制器和视图. 3.访问http://ueditor.baidu.com/website/download.html 进入开发版的下载页面,下载.net UTF-8版本,现在最新