Código de JavaScript - Editor de Texto por secciones / etiquetas

Imágen de perfil

Editor de Texto por secciones / etiquetasgráfica de visualizaciones


JavaScript

estrellaestrellaestrellaestrellaestrella(4)
Publicado el 28 de Mayo del 2017 por ScriptShow
770 visualizaciones desde el 28 de Mayo del 2017. Una media de 49 por semana
  • ScriptShow se encuentra ahora conectado en el
  • chat de PHP
Podemos autorizar ó restringir la edición de texto con JavaScript. Este Script, actúa al clicar en una zona de texto que previamente está declarada dentro de una función...
Modificamos el texto por medio de un Textarea que, al perder el focus, se oculta y devuelve el resultado a la etiqueta que contiene dicho texto. Todo el proceso, se produce en tiempo real, en el lado cliente.
Puede tener diversas aplicaciones.

Espero sea útil.

Requerimientos

Un navegador o dispositivo compatible.

1.0
estrellaestrellaestrellaestrellaestrella(4)

Actualizado el 31 de Julio del 2017 (Publicado el 28 de Mayo del 2017)gráfica de visualizaciones de la versión: 1.0
771 visualizaciones desde el 28 de Mayo del 2017. Una media de 49 por semana
estrellaestrellaestrellaestrellaestrella
estrellaestrellaestrellaestrella
estrellaestrellaestrella
estrellaestrella
estrella

Versión 1.0 revisable.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<!DOCTYPE html>
 
<html>
<body>
<style>
textarea{
width:80%;
border:1px solid;
}
</style>
<script>
function test(e){
if (!e) var x=window.event.srcElement;
else var x=e.target;
if (x.tagName=="HTML" || x.tagName=="BODY" || x.tagName=="TEXTAREA" || x.tagName=="IMG" || x.tagName=="HR") return;
var t=x.innerHTML;
var o=document.createElement("TEXTAREA");
document.body.appendChild(o);
o.focus();
o.innerHTML=t;
o.onblur=function(){
if (o.value.length>=1)x.innerHTML=o.value;document.body.removeChild(o)}
}
document.onclick=test;
</script>
<h2>Click para editar este header</h2>
<p>Click para editar este párrafo ...</p>
<div>Click para editar este div ...</div>
<span>Click para editar este span ...</span>
<hr />
</body>
</html>



Comentarios sobre la versión: 1.0 (4)

Imágen de perfil
xve
28 de Mayo del 2017
estrellaestrellaestrellaestrellaestrella
Impresionante!!!
Responder
Imágen de perfil
Aldo
13 de Junio del 2017
estrellaestrellaestrellaestrellaestrella
saludos malignos
Responder
Ocuilin
23 de Junio del 2017
estrellaestrellaestrellaestrellaestrella
Gracias. Me acabas de dar la solución que andaba buscando desde hace unos días.
Responder
miguel
31 de Julio del 2017
estrellaestrellaestrellaestrellaestrella
esta muy bien .....
Responder

Comentar la versión: 1.0

Nombre
Correo (no se visualiza en la web)
Valoración
Comentarios

http://lwp-l.com/s4006