编辑器中designMode和contentEditable的属性的介绍

HtmlEdit.document.designMode="On";
HtmlEdit是iframe对象ID
IE 中可以设置contentEditable="true"
把div的contentEditable属性设置为 true，在IE浏览器中就可以看到效果了，div中元素都变成可以编辑的了。
<div id="tt" contentEditable="true"></div>
<body contentEditable="true"><!--则整个页面都可以编辑了-->。
Firefox中可以 使用javascript语句设置属性contentDocument.designMode为 "on"
iframeName.document.designMode="on" ;
其中iframeName 为iframe控件的name属性。
在 IE7和 FireFox2.0中测试通过。如果想先初始化加入一些内容及样式，代码示例如下：


代码如下:

if(navigator.appName == "Microsoft Internet Explorer")
{
var IframeID=frames["HtmlEditor"];
if(navigator.appVersion.indexOf("MSIE 6.0",0)==-1){IframeID.document.designMode="On"}
IframeID.document.open();
IframeID.document.write(StyleEditorHeader);
IframeID.document.close();
IframeID.document.body.contentEditable = "True";
IframeID.document.body.innerHTML=HidenObjValue;
IframeID.document.body.style.fontSize="10pt";
}else
{
var _FF = navigator.userAgent.indexOf("Firefox")>-1?true:false;
var IframeID=getObject("HtmlEditor");
HtmlEditor=IframeID.contentWindow;
HtmlEditor.document.designMode="On"
HtmlEditor.document.open();
HtmlEditor.document.write(StyleEditorHeader);
HtmlEditor.document.close();
HtmlEditor.document.body.contentEditable = "True";
HtmlEditor.document.body.innerHTML=HidenObjValue;
}

赞 (0)

相关推荐

  • 编辑器中designMode和contentEditable的属性的介绍

    HtmlEdit.document.designMode="On"; HtmlEdit是iframe对象ID IE 中可以设置contentEditable="true" 把div的contentEditable属性设置为 true,在IE浏览器中就可以看到效果了,div中元素都变成可以编辑的了. <div id="tt" contentEditable="true"></div> <body c

  • Spring中@Transactional(rollbackFor=Exception.class)属性用法介绍

    Spring中@Transactional(rollbackFor=Exception.class)属性用法介绍

    序言 今天我在写代码的时候,看到了.一个注解@Transactional(rollbackFor = Exception.class),今天就和大家分享一下,这个注解的用法: 异常 如下图所示,我们都知道Exception分为运行时异常RuntimeException和非运行时异常 error是一定会回滚的 如果不对运行时异常进行处理,那么出现运行时异常之后,要么是线程中止,要么是主程序终止. 如果不想终止,则必须捕获所有的运行时异常,决不让这个处理线程退出.队列里面出现异常数据了,正常的处理应

  • 图形编辑器中JS实现防误操作之拖拽阻塞

    目录 图形编辑器中 代码改造 结尾 图形编辑器中 在图形编辑器中,想象这么一个场景,我们撤销了一些重要的操作,然后想选中一个图形,看看它的属性.你点了上去,然后你发现你再也无法重做了. 你以为你点了一下,但其实你点击的时候,鼠标还是小小移动了一点,飘了一个像素点.对编辑器来说,它识别到让图形移动一个像素点的操作,就生成了一个新的版本,然后重做栈(redoStack)被清空了,你退回前的操作就没了. 为了解决这类用户微小操作的问题,我们可以巧妙地给拖拽行为加一个 阻塞阈值.具体就是就是按下鼠标后,

  • 如何使用jquery修改css中带有!important的样式属性

    <div class="test">使用jquery修改css中带有!important的样式属性</div> 外部样式为: div.test{ width:auto !important; overflow:auto !important } 通过 $("div.test").css("width","100px");和 $("div.test").css("width&

  • asp.net使用FCK编辑器中的分页符实现长文章分页功能

    本文实例讲述了asp.net使用FCK编辑器中的分页符实现长文章分页功能.分享给大家供大家参考,具体如下: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="SplitContent.aspx.cs" Inherits="SplitContent" %> <%@ Register Assembly="FredCK.FCKeditorV2&

  • bootstrap中的 form表单属性role="form"的作用详解

    html 里面的 role 本质上是增强语义性,当现有的HTML标签不能充分表达语义性的时候,就可以借助role来说明.通常这种情况出现在一些自定义的组件上,这样可增强组件的可访问性.可用性和可交互性. role的作用是描述一个非标准的tag的实际作用.比如用div做button,那么设置div 的 role="button",辅助工具就可以认出这实际上是个button 比如, <div role="checkbox" aria-checked="c

  • JavaScript记录光标在编辑器中位置的实现方法

    本文实例讲述了JavaScript记录光标在编辑器中位置的实现方法.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head

  • js基础之DOM中document对象的常用属性方法详解

    -----引入 每个载入浏览器的 HTML 文档都会成为 Document 对象. Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问. 属性 1  document.anchors  返回对文档中所有 Anchor 对象的引用.还有document.links/document.forms/document.images等 2  document.URL       返回当前文档的url 3  document.title       返回当前文档的标题 4  do

  • JavaScript中获取鼠标位置相关属性总结

    javascript并没有mouse对象,获取鼠标坐标要靠强大的event对象. 我们通过监听document的mousemove,就可以实时获得鼠标位置. 但是!!event中和鼠标相关的属性太多了,很让人头大!如下: event.layerX event.layerY event.clientX event.clientY event.pageX event.pageY event.offsetX event.offsetY event.screenX event.screenY event

  • 全面了解python中的类,对象,方法,属性

    python中一切皆为对象,所谓对象:我自己就是一个对象,我玩的电脑就是对象,坐着的椅子就是对象,家里养的小狗也是一个对象...... 我们通过描述属性(特征)和行为来描述一个对象的.比如家里的小狗,它的颜色,大小,年龄,体重等是它的属性或特征.它会汪汪叫,会摇尾巴等是它的行为. 我们在描述一个真实对象(物体)时包括两个方面: 它可以做什么(行为) 它是什么样的(属性或特征). 在python中,一个对象的特征也称为属性(attribute).它所具有的行为也称为方法(method) 结论:对象

随机推荐