在这里纠正一下某些书籍说 这个修改后的文字内容是无法保存的 的错误必须发送到服务器进行保存才可以（因为我可以保存到内容）看代码吧  也许我理解的不对

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>可编辑</title>

</head>

<body>

    <p id="p1" contentEditable="true">我是可以编辑的内容，快来编辑我吧</p>

    <script type="text/javascript">

         var edit=document.getElementById('p1');

         edit.onblur=function(){

             this.innerHTML=this.innerHTML;

         }

    </script>

</body>

</html>

可以自己尝试一下 你发现你最新编辑的内容在你鼠标离开以后 会把你最新的修改的内容留到元素中

html5小趣味知识点系列（一）contentEditable的更多相关文章

  1. html5小趣味知识点系列（一）spellcheck

    发现一些h5的系ode知识点增加一些趣味性 实用性 不敢妄自评论  觉得有用就用一下  没用就路过一下 spellcheck属性 它的功能是针对用户输入的文本内容进行拼写和语法检查 用于input 和 ...

  2. html5小趣味知识点系列（一）required

    都知道这个属性是检查你 是否填写了字段也就是说咱们不用判断输入的数值是否为空的情况了 但是这个属性一定要和form配合在一起使用单独的使用是不可以实现的 <!DOCTYPE html> & ...

  3. html5小趣味知识点系列（一）autofocus

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. html5小趣味知识点系列（一）pubdate

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. html5小趣味知识点系列（二）tabindex

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. 推荐10款超级有趣的HTML5小游戏

    HTML5的发展速度比任何人的都想像都要更快.更加强大有效的和专业的解决方案已经被开发......甚至在游戏世界中!这里跟大家分享有10款超级趣味的HTML5游戏,希望大家能够喜欢! Kern Typ ...

  7. 微信小程序开发系列五：微信小程序中如何响应用户输入事件

    微信小程序开发系列教程 微信小程序开发系列一:微信小程序的申请和开发环境的搭建 微信小程序开发系列二:微信小程序的视图设计 微信小程序开发系列三:微信小程序的调试方法 微信小程序开发系列四:微信小程序 ...

  8. 【微信小程序开发•系列文章六】生命周期和路由

    这篇文章理论的知识比较多一些,都是个人观点,描述有失妥当的地方希望读者指出. [微信小程序开发•系列文章一]入门 [微信小程序开发•系列文章二]视图层 [微信小程序开发•系列文章三]数据层 [微信小程 ...

  9. 小学徒成长系列—StringBuilder & StringBuffer关键源码解析

    在前面的博文<小学徒成长系列—String关键源码解析>和<小学徒进阶系列—JVM对String的处理>中,我们讲到了关于String的常用方法以及JVM对字符串常量Strin ...

随机推荐

  1. linux 内核学习

    http://www.cnblogs.com/tolimit/category/697314.html

  2. VUE -- Mac上解决Chrome浏览器跨域问题

    最近做前端开发总是遇到一个很奇怪的现象,同一个AJAX请求,在Chrome里调试的时候就会提示跨域,但是在手机模拟器或者真机上调试的时候就不会,于是百度了一下,发现是Chrome的安全策略导致的,需要 ...

  3. 去除自定义Toolbar中左边距

    问题 自定义Toolbar之后,发现左侧不能完全填充,总是留一点空白,如下图: 原因 查看Wiget.AppCompat.Toolbar的parent(Toolbar默认的style),如下: < ...

  4. 64位Ubuntu 14.04 安装wps

    因为wps还没有提供64位版本号的wps,13.10開始又取消了ia32-libs的支持,经过自己測试,能够使用下面命令完毕安装 sudo dpkg -i 包名 sudo apt-get -f ins ...

  5. oracle sql试题

    转载 数据准备 create table student(  sno varchar2(10) primary key,  sname varchar2(20),  sage number(3),  ...

  6. 2017.7.1 ftp文件服务器安装与配置（已验证可使用）

    下载地址:http://learning.happymmall.com/ 1.点击exe文件 2.启动ftpserver 点击exe后,就出现如下画面:输入账户密码和勾选权限等. 并配置好对应的文件夹 ...

  7. JAVA Eclipse 启动 Eclipse 弹出“Failed to load the JNI shared library jvm_dll”怎么办

    原因1:给定目录下jvm.dll不存在. 对策:(1)重新安装jre或者jdk并配置好环境变量.(2)copy一个jvm.dll放在该目录下. 原因2:eclipse的版本与jre或者jdk版本不一致 ...

  8. Android学习（十七）自定义View控件 TopBar

    一.创建自定义TopBar头部菜单条 实现步骤: 1.在values中添加attrs.xml文件,设置自定义属性. 2.添加Topbar类,继承RelativeLayout,实现具体功能. 3.添加到 ...

  9. Laravel之HTTP相应

    一.基本相应示例 1.返回简单字符串 Route::get('/', function () { return 'Hello World'; }); 给定的字符串会被框架自动转化为 HTTP 响应 2 ...

  10. mysql常用命令和函数

    一.DROP IF EXISTS DROP FUNCTION IF EXISTS fun;DROP TABLE IF EXISTS table; 二.数据表1.建立表CREATE TABLE test ...