六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 112|回复: 0

HTML5内联编辑

[复制链接]

升级  17.33%

74

主题

74

主题

74

主题

举人

Rank: 3Rank: 3

积分
252
 楼主| 发表于 2013-1-29 13:44:54 | 显示全部楼层 |阅读模式
 
下面的例子展示了使用div的内联编辑模式。
 
 
<html>  <head>    <title>      Editable <div> Element    </title>    <script type="text/javascript">      function showSource()       {        var content = document.getElementById          ("div").innerHTML;        content.replace(/</g,'<');        content.replace(/>/g, '>');        alert(content);      }        function createLink()       {        var url = prompt("Enter URL:", "http://");        if (url)          document.execCommand("createlink",  false, url);      }    </script>  </head>  <body>    <h1>Editable <div> Element</h1>    <div>       <input type="button" value="Bold"   >       <input type="button" value="Italic"   >       <input type="button" value="Underline"         >       <input type="button" value="Add Link"   >       <input type="button"  value="Display Source"  >     </div>     <br>    <div id="div" style='border:solid   black; height: 300px; width: 400px'  contenteditable="true">    </div>   </body></html>源码下载:
 
EditDiv.zip
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表