为啥在div里面做富文本编辑没有作用
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了为啥在div里面做富文本编辑没有作用相关的知识,希望对你有一定的参考价值。
我用的div实现富文本编辑 先给它一个contentEditable 属性为true 然后定义一个span 昨晚按钮 绑定“click”事件 然后用execCommand方法 但是却没有效果
代码如下
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>富文本编辑</title>
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<body>
<span id="bold">加粗</span>
<span id="italic">斜体</span>
<div id="text">123</div>
<script type="text/javascript" src="text.js"></script>
</body>
</html>
js代码如下
var EventUtil =
addHandler : function (element,type,handler)
// body...
if (element.addEventListener)
element.addEventListener(type,handler,false);
else if (element.attchEvent)
element.attchEvent("on" + type,handler);
else
element["on" + type] = handler;
,
removeHandler : function (element,type,handler)
// body...
if (element.removeEventListener)
element.removeEventListener(type,handler,false);
else if (element.detachEvent)
element.detachEvent("on" + type,handler);
else
element["on" + type] = null;
;
var button = document.getElementById('bold'),
italic1 = document.getElementById('italic');
var text = document.getElementById('text');
EventUtil.addHandler(window,"load",function ()
// body...
text.contentEditable = "true";
);
EventUtil.addHandler(button,"click",function (argument)
// body...
document.execCommand("bold",false,null);
text.focus();
)
我为啥要做富文本编辑器
富文本编辑器,RichTextEditor,简称RTE,是一种可内嵌于浏览器,所见即所得的文本编辑器。它提供类似于比如谷歌、火狐效果都非常不错,在功能的丰富性来说,还是IE强些(但IE的6、7、8、9几个版本就足够搞死开发者了)。富文本编辑器不同于文本编辑器,程序员可到网上下载免费的富文本编辑器内嵌于自己的网站或程序里(当然付费的功能会更强大些),方便用户编辑文章或信息。
比较好的文本编辑器有kindeditor,fckeditor等,百度推出的开源富文本编辑器UEditor算是其中的后起之秀。 参考技术A 这是对应于记事本之类的纯文本编辑器而言,就是文本中带有控制符的文本编辑器,如可以带文字的字体、字号、颜色等控制符,而纯文本编辑器编辑的文件是不带这些控制符的。
以上是关于为啥在div里面做富文本编辑没有作用的主要内容,如果未能解决你的问题,请参考以下文章