Gracias, Wikipedia.
ShareCode
Permalink: http://www.treeweb.es/u/974/ 01/02/2011

ShareCode

1 2 var log_panel = null;3 4 window.addEventListener('load', init, true);5 6 7 function init() {8  log_panel = document.getElementById('log');9  10  /*11  var p1 = document.getElementById('parte1');12  p1.contentEditable=true;13  p1.addEventListener('keydown', div_editable_keydown, true);14 */15  add_text(document.getElementById('document'));16  17  18 }19 20 var add_text = function(parent) {21  var dom = document.createElement('div');22  var comments = document.createElement('div'); comments.className = 'comments';23  var users1 = document.createElement('div'); users1.style.cssFloat = 'right'; users1.style.fontSize='10px';24  var users2 = document.createElement('div'); users2.innerHTML = 'Editando: fulanita'; users2.style.display = 'inline';25  var users3 = document.createElement('div'); users3.innerHTML = ' + '; users3.style.display = 'inline'; users3.style.color = 'blue';26  users3.addEventListener('click', function() {27  var comment = document.createElement('div');28  comment.className = 'comment';29  comment.innerHTML = 'Su comentario...';30  comment.contentEditable = true;31  comments.appendChild(comment);32  comment.focus();33  }, true);34  var editor = document.createElement('div'); editor.className = 'editor-text';35  dom.appendChild(comments);36  dom.appendChild(users1);37  dom.appendChild(editor);38  users1.appendChild(users2);39  users1.appendChild(users3);40  editor.innerHTML = '';41  editor.style.minHeight = '15px';42 43  editor.addEventListener('keydown', div_editable_keydown, true);44  editor.addEventListener('blur', div_editable_blur, true);45  if(parent.parentNode.nextSibling) {46  parent.parentNode.parentNode.insertBefore(dom, parent.parentNode.nextSibling);47  } else {48  parent.appendChild(parent.parentNode);49  }50  editor.contentEditable=true; 51  editor.focus();52 }53 54 var div_editable_keydown = function(event) {55  if (event.keyCode == 13) {56  event.stopPropagation();57  event.preventDefault();58  add_text(this);59  }60 }61 62 var div_editable_blur = function (event) {63  log('Event change: '+event.target.innerHTML);64 }65 66 67 function log(txt) {68  if (log_panel != null) log_panel.innerHTML = txt+'<br>'+log_panel.innerHTML;69 }
Enlace
El enlace para compartir es: