- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
- <title>編輯</title>
- <script type="text/javascript">
- var curObj = null;
- function showForm(obj){
- if (curObj == null){
- curObj = obj;
- obj.innerHTML = "<textarea onblur=\"submitIt(this);\">" + obj.innerHTML + "</textarea>";
- obj.firstChild.select();
- }
- }
- function submitIt(obj){
- curObj.innerHTML = obj.value;
- curObj = null;
- }
- </script>
- <style>
- div {
- overflow: auto;
- padding:5px;
- border:1px solid #FF6600;
- background-color:#FFFFCC;
- width:200px;
- height:160px;
- }
- form {
- margin: 0;
- }
- textarea {
- border:1px solid #999999;
- width: 190px;
- height: 150px;
- }
- </style>
- </head>
- <body>
- <div id="editArea_1" onclick="showForm(this);">Here is some <strong>text</strong>.</div>
- <br />
- <div id="editArea_2" onclick="showForm(this);">Here is some text.<br />
- <br />
- Just so so... :D </div>
- </body>
- </html>