• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >html5 > H5富文本编辑器的详细介绍

H5富文本编辑器的详细介绍

作者:匿名 字体:[增加 减小] 来源:互联网 时间:2018-12-03

本文主要包含0等相关知识,匿名希望在学习及工作中可以帮助到您
使用H5的全局属性contenteditable可以让DOM元素及其子元素变的可编辑

<div contenteditable id="editor"> </div>

样式代码

html, body { overflow: hidden; width: 100%; height: 100%; }* { margin: 0; padding: 0; } #editor { width: 100%; height: 100%; outline: none; padding-left: 15px; }

* chrome 49下测试有效

以下方式使得用户初始输入的文本内容在p元素的包裹下

function cursorToEnd(element){ element.focus();var range = window.getSelection(); range.selectAllChildren(element); range.collapseToEnd(); }

window.getSelection() IE9已经支持

不定位可能发生以下情况

<div contenteditable id="editor" spellcheck="false"> 111111 <p><br/></p> </div>

以上就是H5富文本编辑器的详细介绍的详细内容,更多请关注微课江湖其它相关文章!

您可能想查找下面的文章:

相关文章

  • 2017-08-06HTML5 Canvas玩转酷炫大波浪进度图效果实例(附demo)
  • 2018-12-03h5页面如何调用摄像头代码分享
  • 2018-12-03HTML5游戏开发 之 资源加载篇(1)
  • 2018-12-03详解html5的video标签测试应用
  • 2017-08-06突破canvas语法限制 让他支持链式语法
  • 2017-08-06详解移动端HTML5页面端去掉input输入框的白色背景和边框(兼容Android和ios)
  • 2018-12-03Html5 Canvas Image的图文代码详解(一)
  • 2017-08-06HTML5实现页面切换激活的PageVisibility API使用初探
  • 2018-12-03html5使用html2canvas实现浏览器截图
  • 2017-08-06HTML5不支持标签和新增标签详解

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • HTML5 Plus 实现手机APP拍照或相册选择图片上传的功能
    • H5的localStorage使用总结
    • HTML5仿苹果手机的面板合拢折叠效果
    • HTML5 History模式是什么
    • HTML5页面调起APP功能的方法试验
    • 10年来HTML5如何给Flash这只病猫盖棺的详解
    • Html5新标签datalist相关用法介绍
    • HTML5实战与剖析之媒体元素(6、视频实例)
    • 未来是 HTML 5 还是 Flash 的时代?
    • HTML5 canvas绘制的玫瑰花效果_html5教程技巧

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有