elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Los 10 CVE más críticos (peligrosos) de 2020


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  [javascript] Editar html seleccionado | Randy |
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] 2 Ir Abajo Respuesta Imprimir
Autor Tema: [javascript] Editar html seleccionado | Randy |  (Leído 5,625 veces)
patilanz


Desconectado Desconectado

Mensajes: 481

555-555-0199@example.com


Ver Perfil WWW
[javascript] Editar html seleccionado | Randy |
« en: 25 Febrero 2015, 01:06 am »

Hola necesito ayuda con las selecciones del os usuario y su edición para agregar texto o elementos html. Con la librería randy https://code.google.com/p/rangy/wiki/RangySelection#Introduction se puede hacer y es compatible con todos los navegador pero yo quiero saber como funciona y todas las funciones de los distintos navegadores.
Ejemplo de randy; http://rangy.googlecode.com/svn/trunk/demos/core.html


He buscado pero es un lió y un poco desactualizado. Alguien me recomienda un tuto ?

Un saludo


« Última modificación: 25 Febrero 2015, 09:25 am por patilanz » En línea

Usuario Invitado


Desconectado Desconectado

Mensajes: 625



Ver Perfil
Re: [javascript] Editar html seleccionado | Randy |
« Respuesta #1 en: 25 Febrero 2015, 13:36 pm »

¿Qué es exactamente lo que deseas hacer? Supongo que algo complicado para usar una biblioteca externa.


En línea

"La vida es muy peligrosa. No por las personas que hacen el mal, si no por las que se sientan a ver lo que pasa." Albert Einstein
patilanz


Desconectado Desconectado

Mensajes: 481

555-555-0199@example.com


Ver Perfil WWW
Re: [javascript] Editar html seleccionado | Randy |
« Respuesta #2 en: 25 Febrero 2015, 14:03 pm »

Crear una pagina que te permite crear paginas pero necesito javascript para permitir editar elementos de la pagina que tienen el atributo contenteditable y aparte un menú que te permite agregar elementos en la pagina pero para esto necesito ver donde esta el foco, si hay algo seleccionado, agregar elementos ...

Supongo que algo complicado para usar una biblioteca externa.

No quiero usar la librería pero quiero saber como funcionan sus métodos y funciones en todos los navegadores. Quiero un tutorial sobre funciones como document.getSelection.
En línea

MinusFour
Moderador Global
***
Desconectado Desconectado

Mensajes: 5.529


I'm fourth.


Ver Perfil WWW
Re: [javascript] Editar html seleccionado | Randy |
« Respuesta #3 en: 25 Febrero 2015, 16:26 pm »

Crear una pagina que te permite crear paginas pero necesito javascript para permitir editar elementos de la pagina que tienen el atributo contenteditable y aparte un menú que te permite agregar elementos en la pagina pero para esto necesito ver donde esta el foco, si hay algo seleccionado, agregar elementos ...

No quiero usar la librería pero quiero saber como funcionan sus métodos y funciones en todos los navegadores. Quiero un tutorial sobre funciones como document.getSelection.

No todos los elementos pueden ser enfocados y no todo el espacio es ocupado por los elementos. Lo que puedes hacer es simplemente usar una variable para sacar el "foco". Para algunos elementos puedes usar click en lugar de focus, i.e.:

http://jsfiddle.net/khmkz33c/
En línea

patilanz


Desconectado Desconectado

Mensajes: 481

555-555-0199@example.com


Ver Perfil WWW
Re: [javascript] Editar html seleccionado | Randy |
« Respuesta #4 en: 25 Febrero 2015, 16:48 pm »

Gracias por tu respuesta pero no me refiria a esto, puedes ver el ejemplo aquí http://rangy.googlecode.com/svn/trunk/demos/core.html
En línea

MinusFour
Moderador Global
***
Desconectado Desconectado

Mensajes: 5.529


I'm fourth.


Ver Perfil WWW
Re: [javascript] Editar html seleccionado | Randy |
« Respuesta #5 en: 25 Febrero 2015, 18:00 pm »

Gracias por tu respuesta pero no me refiria a esto, puedes ver el ejemplo aquí http://rangy.googlecode.com/svn/trunk/demos/core.html

¿Quieres saber la posicion del cursor sobre el texto? Para contenido editable si es posible (inputs, contenteditable).

http://jsfiddle.net/xw4u4ut9/

No estoy seguro si getSelection funcione dentro de inputs, me parece que ahi se usa selectionStart.
En línea

Usuario Invitado


Desconectado Desconectado

Mensajes: 625



Ver Perfil
Re: [javascript] Editar html seleccionado | Randy |
« Respuesta #6 en: 25 Febrero 2015, 21:53 pm »

Sí, como dice MinusFour, con selectionStart obtienes la posición del cursor en un textbox. Puedes ver un ejemplo aquí
En línea

"La vida es muy peligrosa. No por las personas que hacen el mal, si no por las que se sientan a ver lo que pasa." Albert Einstein
patilanz


Desconectado Desconectado

Mensajes: 481

555-555-0199@example.com


Ver Perfil WWW
Re: [javascript] Editar html seleccionado | Randy |
« Respuesta #7 en: 25 Febrero 2015, 22:58 pm »

Vale y por ejemplo supongamos que el usuario selecciona la algo como esto:

Código
  1. hola <div>que </div><button>tal?</div>

Es un div que contiene otro div y un button pero el usuario selecciona solo la mitad del div padre. Yo quiero eliminar esta parte e insertar otro nodo dentro del div padre eliminando al button y al div hijo seleccionados.

También esta el problema de que de getSelection solo es compatible desde ie 9 en 8 no funciona.
« Última modificación: 25 Febrero 2015, 23:00 pm por patilanz » En línea

MinusFour
Moderador Global
***
Desconectado Desconectado

Mensajes: 5.529


I'm fourth.


Ver Perfil WWW
Re: [javascript] Editar html seleccionado | Randy |
« Respuesta #8 en: 26 Febrero 2015, 00:00 am »

Vale y por ejemplo supongamos que el usuario selecciona la algo como esto:

Código
  1. hola <div>que </div><button>tal?</div>

Es un div que contiene otro div y un button pero el usuario selecciona solo la mitad del div padre. Yo quiero eliminar esta parte e insertar otro nodo dentro del div padre eliminando al button y al div hijo seleccionados.

También esta el problema de que de getSelection solo es compatible desde ie 9 en 8 no funciona.

Si de verdad te preocupa la compatibilidad mejor usas Rangy (no randy). En cuanto a como borrar texto de una seleccion:

https://developer.mozilla.org/en-US/docs/Web/API/Selection/deleteFromDocument
En línea

patilanz


Desconectado Desconectado

Mensajes: 481

555-555-0199@example.com


Ver Perfil WWW
Re: [javascript] Editar html seleccionado | Randy |
« Respuesta #9 en: 26 Febrero 2015, 01:43 am »

Bueno es que quiero saber los métodos y maneras de hacer lo en todos los navegadores. Creo que tengo que buscar las maneras y adoptarlo por mi cuenta.
En línea

Páginas: [1] 2 Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
Swf,html o javascript
Diseño Gráfico
Sirena_Dejavu 6 3,529 Último mensaje 2 Julio 2004, 09:56 am
por theskull
Programacion en HTML, PHP, javascript
PHP
Daniel G 0 1,696 Último mensaje 26 Abril 2007, 16:32 pm
por Daniel G
Script o algo para editar archivos php o html?
Desarrollo Web
XXXXXX 8 8,610 Último mensaje 25 Agosto 2010, 17:51 pm
por :ohk<any>
Html/javascript Injection
Nivel Web
Dacan 2 5,130 Último mensaje 17 Marzo 2011, 13:49 pm
por Castg!
Programa para editar archivos en grandes cantidades a la vez. (.txt o .html)
Software
hackmastter 3 1,082 Último mensaje 20 Febrero 2015, 00:31 am
por Eleкtro
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines