初入it职场,文本编辑器真的让人捉摸不透。最终在前端姐姐帮助下弄好了↓ 先在头部写好编辑器的各种功能的总体模型

<script>var editor;
KindEditor.ready(function(K) {editor = K.create('textarea[name="content"]', {
resizeType : 1,allowPreviewEmoticons : false,
items : ['fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
'insertunorderedlist']});});</script>

在对应的地方(如:div)写好<textarea>框以及隐藏域 注:textarea是iframe里的,直接取值会取不到,所以加一个<input>隐藏域,

<textarea name="content" id="new_message" style="border-color: black;border:1px solid gray; background-color: white;height: 450px; width:784px; display:block;word-break: break-all;word-wrap: break-word; overflow-y:auto; visibility: hidden;" onkeyup="SwapTxt()" ></textarea>
<input type="hidden" name="crmNoticeManage.contentStr" id="noticecontentStr" value="">

取文本编辑器里面你的值。

var text = "";

$("#noticecontentStr").val(editor.html());
var bgvalue=$("#noticecontentStr").val();
alert(editor.html());    将textarea里面的值赋给隐藏域,再获取隐藏域的值,这样就取到输入文本框的值了。

这只是页面上需要写的代码,还需要引入js文件和css文件引入才可以实现,如果谁需要可以留言告诉我,我看到会立刻回复的。 效果为:QQ写邮件那种

html里文本编辑器如何制作呢?的更多相关文章

  1. ASP.NET MVC + 百度富文本编辑器 + EasyUi + EntityFrameWork 制作一个添加新闻功能

    本文将交大伙怎么集成ASP.NET MVC + 百度富文本编辑器 + EasyUi + EntityFrameWork来制作一个新闻系统 先上截图: 添加页面如下: 下面来看代码部分 列表页如下: @ ...

  2. C# RichTextBox 制作文本编辑器

    本文利用一个简单的小例子[文本编辑器],讲解RichTextBox的用法,仅供学习分享使用,如有不足之处,还请指正. Windows窗体中的RichTextBox控件用于显示,输入和操作格式化的文本, ...

  3. [前端随笔][JavaScript] 制作一个富文本编辑器

    写在前面 现在网上有很多现成的富文本编辑器,比如百度家的UEditor,kindeditor,niceditor等等,功能特别的多,API也很多,要去熟悉他的规则也很麻烦,所以想自己了解一下原理,做一 ...

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

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

  5. Bzoj1269 [AHOI2006]文本编辑器editor

    Time Limit: 10 Sec  Memory Limit: 162 MBSubmit: 3678  Solved: 1380 Description 这些日子,可可不和卡卡一起玩了,原来可可正 ...

  6. Unix及类Unix系统文本编辑器的介绍

    概述 Vim是一个类似于Vi的著名的功能强大.高度可定制的文本编辑器,在Vi的基础上改进和增加了很多特性.VIM是纯粹的自由软件. Vim普遍被推崇为类Vi编辑器中最好的一个,事实上真正的劲敌来自Em ...

  7. 在Visual Studio 2012 Blue theme下使用Dark theme的文本编辑器颜色设置

    Visual Studio 2012 默认提供了3种color theme: blue,light,和dark.其中dark的文本编辑器颜色设定很爽,可是整个菜单项加上一些小的窗口如Find Resu ...

  8. 强大好用的"文本"编辑器

    1 editplugs 说明:EditPlus是一款由韩国 Sangil Kim (ES-Computing)出品的小巧但是功能强大的可处理文本.HTML和程序语言的Windows编辑器,你甚至可以通 ...

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

    2015年6月28日 23:08:49 星期日 效果: 开搞;) 首先: 百度官网上下载 umeditor 简版的富文本编辑器(这里) 然后: 解压放到自己的项目中, 配置服务器, 保证能在浏览器端加 ...

随机推荐

  1. 解决IE6下JS动态插入iframe不显示的方法

    function myshowBox(titles, urls, objWidth, objHeight, flags) {     var _title = titles;     var _url ...

  2. SQL Server Profiler工具

    一.SQL Profiler工具简介 SQL Profiler是一个图形界面和一组系统存储过程,其作用如下: 图形化监视SQL Server查询: 在后台收集查询信息: 分析性能: 诊断像死锁之类的问 ...

  3. 第三节:视图(Views)和模板(Templates)

    目录 概览 编写视图 编辑视图实际做一些事情 抛出404异常 使用模板系统 移除在代码中的硬编码网址 Url名称的命名空间 概览 视图是Django应用的网页的“类型”,一般服务于特定的功能并且有特定 ...

  4. 8、java继承中的this和super的应用

    java中只支持单继承,这是为了防止继承的父类中出现同样的函数不知道调用哪个好.虽然java只支持单继承但是有多实现来补偿. 子父类出现后,类成员的特点: 类中成员:1,变量.2,函数.3,构造函数. ...

  5. UE用法

    ueditor去除自动转换  ueditor在使用中发现很多问题.比如自动添加P标签,自动去除span,自动给li添加ul开始结束,自动把div转成P标签等等. 其实很多在百度上可以找到.这里总结下, ...

  6. maya,mel,eval,stringarray

    mel里,当要eval("client()"),并且要传递stirngarray参数给函数client()时,正确的写法应该是: global proc intermediator ...

  7. Android 另类方法监听软键盘的弹出收起事件

    http://www.cnblogs.com/csonezp/p/5065624.html 最近做的项目碰到个问题,a界面是fragment+recyclerview,b界面带个edittext,并且 ...

  8. Discuz有关问题解决办法汇总

    1.Can not write to cache files, please check directory ./data/ and ./data/cache/ . 无法写入缓存 解决办法:在sour ...

  9. ASP.NET MVC路由配置(转载自http://www.cnblogs.com/zeusro/p/RouteConfig.html )

    把apress.pro.asp.net.mvc.4.framework里的CHAPTER 13翻译过来罢了. XD 首先说URL的构造. 其实这个也谈不上构造,只是语法特性吧. 命名参数规范+匿名对象 ...

  10. [Linux] LVM的条带化

    一.什么是条带化 当多个进程同时访问一个磁盘时,可能会出现磁盘冲突.磁盘系统对访问次数(每秒的IO操作,IOPS)和数据传输速率(读写速率,TPS)有限制. 当达到这些限制时,后面需要访问磁盘的进程就 ...