文本编辑器:可以从网上下载---ueditor文件夹里面包含php和utf8-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>
<!--文本编辑器显示区域-->
<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() {
//主要作用语句
//在文本编辑器中写入内容,点击获得内容按钮后,在xianshi<div>里显示内容
document.getElementById("xianshi").innerHTML = UE.getEditor('editor').getContent();
} </script>
</html>

文本编辑器中写入的内容:

xianshi<div>中现实的内容:

写入内容:

<!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>
<!--文本编辑器显示区域-->
<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 setContent(isAppendTo) {
var str = "<p style='white-space: normal;'><span style='background-color: rgb(84, 141, 212);'>斯柯达晶高科的复活节</span><img src='http://localhost:8080/ueditor/php/upload/image/20160704/1467600934975616.png' title='1467600934975616.png' alt='6.png'></p><p style='white-space: normal;'><span style='text-decoration: underline; color: rgb(0, 176, 80);'><em>看电视剧赶快回家回家的撒</em></span></p><p><br></p>";
//主要作用语句
UE.getEditor('editor').setContent(str, isAppendTo);
}
</script>
</html>

写入内容前现实的内容:

获取内容代码加到对应的方法中,然后写入内容,显示一样的内容:

Thinkphp 文本编辑器的更多相关文章

  1. 【ThinkPHP学习】ThinkPHP自己主动转义存储富文本编辑器内容导致读取出错

    RT. ThinkPHP的conf文件里的Convention.php有一个配置选项 'DEFAULT_FILTER' => 'htmlspecialchars', // 默认參数过滤方法 用于 ...

  2. ThinkPHP讲解(十二)——文本编辑器和ajax传址

    一.文本编辑器 1.首先,在网上下载ueditor文件 2.在要添加文本编辑器的页面中引用ueditor文件中的js文件 <script type="text/javascript&q ...

  3. PHP如何搭建百度Ueditor富文本编辑器

    本文为大家分享了PHP搭建百度Ueditor富文本编辑器的方法,供大家参考,具体内容如下 下载UEditor 官网:下载地址 将下载好的文件解压到thinkphp项目中,本文是解压到PUBLIC目录下 ...

  4. 项目页面集成ckeditor富文本编辑器

    步骤一.引入ckeditor.js (注:本实例以ThinkPHP3.2框架为载体,不熟悉ThinkPHP的朋友请自行补习,ckeditor文件代码内容也请去ckeditor官网自行下载) 作为程序员 ...

  5. thinkphp5.1中适配百度富文本编辑器ueditor

    百度富文本编辑器ueditor虽然很老,但是功能齐全,我近期需要能批量粘贴图片的功能,但是找不到,很无奈.然后现在就分享一下如何把ueditor适配到thinkphp5.1,有知道如何批量上传图片的艾 ...

  6. 富文本编辑器Simditor的简易使用

    最近打算自己做一个博客系统,并不打算使用帝国cms或者wordpress之类的做后台管理!自己处于学习阶段也就想把从前台到后台一起谢了.好了,废话不多说了,先来看看富文本编辑器SimDitor,这里是 ...

  7. 个人网站对xss跨站脚本攻击(重点是富文本编辑器情况)和sql注入攻击的防范

    昨天本博客受到了xss跨站脚本注入攻击,3分钟攻陷--其实攻击者进攻的手法很简单,没啥技术含量.只能感叹自己之前竟然完全没防范. 这是数据库里留下的一些记录.最后那人弄了一个无限循环弹出框的脚本,估计 ...

  8. 关于SMARTFORMS文本编辑器出错

    最近在做ISH的一个打印功能,SMARTFORM的需求本身很简单,但做起来则一波三折. 使用环境是这样的:Windows 7 64bit + SAP GUI 740 Patch 5 + MS Offi ...

  9. 基于trie树的具有联想功能的文本编辑器

    之前的软件设计与开发实践课程中,自己构思的大作业题目.做的具有核心功能,但是还欠缺边边角角的小功能和持久化数据结构,先放出来,有机会一点点改.github:https://github.com/chu ...

随机推荐

  1. OpenGL图形管线和坐标变换

    转:http://blog.csdn.net/zhulinpptor/article/details/5897102 1. OpenGL 渲染管线 OpenGL渲染管线分为两大部分,模型观测变换(Mo ...

  2. C++程序原码

    直接插入排序基本算法 #include<iostream.h> #include<stdlib.h> #include<time.h> const int n=10 ...

  3. [Locked] Group Shifted Strings

    Group Shifted Strings Given a string, we can "shift" each of its letter to its successive ...

  4. C++的一些内置函数

    C++里面有一些内置函数,实现了一些常用功能.虽然我手写也能写出这些函数,但是在srm或者其他一些需要速度的地方,用内置函数的优势就能体现出来了. 1.__gcd(a, b),返回a,b的最大公约数, ...

  5. Hard 不用+号实现两个数之和 @CareerCup

    例子: 759+674 1)不考虑进位:   323 2)只考虑进位:1110 3)两者之和:1433 递归求解c package Hard; /** * Write a function that ...

  6. Java学习的随笔(一)对象概念、this指针、权限修饰符

    最近在看<Java编程思想>,下面按照最近看书的顺序梳理一下心得,由于是初次学习,大部分心得是摘抄自书中: 1. Java中,每个变量都是一个对象. 在创建时首先在内存的堆栈中创建一个该对 ...

  7. Windows下Postgre SQL数据库通过Slony-I 实现数据库双机同步备份

    一. 我们要实现的环境是windows xp.windows2003上安装Postgre SQL数据库,实现目的是两台数据库服务器进行数据库同步,即数据库同步更新.删除.插入等对数据库的操作. 二. ...

  8. android设置view透明度的效果

    android设置view透明度的效果 推荐textView.setBackgroundColor(Color.TRANSPARENT);     第一种方法:在xml文件中设置背景颜色. andro ...

  9. Delphi系统托盘组件 TTrayIcon 简介

    TTrayIcon 的主要属性: TrayIcon.Icon指定托盘图标, 有几种用法:1.设计时选择;2.把一个 TIcon 对象给它;3.使用当前程序图标: TrayIcon1.Icon := A ...

  10. Android(java)学习笔记221:开发一个多界面的应用程序之不同界面间互相传递数据(短信助手案例)

    1.首先我们看看下面这个需求: 这里我们在A界面上,点击这个按钮"选择要发送的短信",开启B界面上获取网络上各种短信祝福语,然后B界面会把这些网络祝福语短信发送给A界面到" ...