Script funciona en FIREFOX, OPERA, pero no en IE

hgp147 · #1 (**permalink**) 08/03/2008, 17:55

Hola, tengo un script para poner caritas en input text pero no me funciona en IE. Pueden verlo en http://hgp147.110mb.com/caritas.htm

Gracias por su ayuda.

caricatos · #2 (**permalink**) 09/03/2008, 00:57

Hola:

Sí, con explorer es distinto... en las FAQs creo que hay algunos mensajes que lo explican bien; también puedes usar el script de esta página: Editor de texto

Saludos

hgp147 · #3 (**permalink**) 09/03/2008, 10:00

Gracias caricatos, voy a ver si lo puedo modificar para solo los smyles.

hgp147 · #4 (**permalink**) 09/03/2008, 11:53

Ya lo modique. Te fijas si esta bien caricatos? Gracias.
Probado en FIREFOX 2, IE 6 Y OPERA 9, funciona bien en los tres. Podés verlo aquí http://hgp147.110mb.com/index.htm en funcionamiento.
Quedo así:

Archivo index.htm

Código HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Editor de texto</title>

<script type="text/javascript" src="editor_002.js"></script>
<script type="text/javascript" src="personal.js"></script>
				
</head>

<body onload="elEditor = ini_editor(document.getElementsByTagName('textarea')[0]);">


<form action="">

<textarea name="texto" rows="10" cols="80" id="texto" onfocus="elEditor = ini_editor(this)" onchange="prever()"></textarea>

<fieldset>

			
<img src="00.gif" onclick='ponerEmoticon("[:)]")' style="cursor: pointer;">
<img src="01.gif" onclick='ponerEmoticon("[:(]")' style="cursor: pointer;">
<img src="02.gif" onclick='ponerEmoticon("[:x]")' style="cursor: pointer;">
<img src="03.gif" onclick='ponerEmoticon("[BIEN]")' style="cursor: pointer;">
<img src="04.gif" onclick='ponerEmoticon("[MAL]")' style="cursor: pointer;">
<img src="05.gif" onclick='ponerEmoticon("[SI]")' style="cursor: pointer;">
<img src="06.gif" onclick='ponerEmoticon("[NO]")' style="cursor: pointer;">
<img src="07.gif" onclick='ponerEmoticon("[APLAUSOS]")' style="cursor: pointer;">
<img src="08.gif" onclick='ponerEmoticon("[MEJORABLE]")' style="cursor: pointer;">
<img src="09.gif" onclick='ponerEmoticon("[¡A VER!]")' style="cursor: pointer;">
<img src="10.gif" onclick='ponerEmoticon("[¡DÉJAME PENSAR!]")' style="cursor: pointer;">
<img src="11.gif" onclick='ponerEmoticon("[FLIPE]")' style="cursor: pointer;">
<img src="12.gif" onclick='ponerEmoticon("[¡SIN PALABRAS!]")' style="cursor: pointer;">

</fieldset>

</form>

</body>
</html>

Archivo editor_002.js

Código:

var _navegador = navigator.userAgent;
var ie = /msi/i.test(_navegador);
var op = /opera/i.test(_navegador);
var mo = /gecko/i.test(_navegador);
var otro = !(ie || mo);
var _insertor, _insertar, _formulario, _texto, _lector = "";

function datos_ie() {
	_texto = document.selection.createRange().text;
	if (_formulario.createTextRange)
		_formulario.posi = document.selection.createRange().duplicate();
	return true;
}

function captura_ie()	{
	return _texto;
}

function captura_mo() {
	with (_formulario) return value.substring(selectionStart, selectionEnd);
}

function captura_otro()	{
	return "";
}

function poner_mo(f, x)	{//alert(x);
	var _ini = f.selectionStart;
	var _fin = f.selectionEnd;
	var inicio = f.value.substr(0, _ini);
	var fin = f.value.substr(_fin, f.value.length);

	f.value = inicio + x + fin;
	if (_ini == _fin)	{
		f.selectionStart = inicio.length + x.length;
		f.selectionEnd = f.selectionStart;
	}
	else	{
		f.selectionStart = inicio.length;
		f.selectionEnd = inicio.length + x.length;
	}
	f.focus();
}

function poner_otro(f, x)	{// opera u otros navegadores desconocidos
	f.value += x;//alert(x);
	f.focus();
}

function poner_ie(f, x)	{
	f.focus();
	if (f.createTextRange)	{// && f.posi)	{
		if (!f.posi)	datos_ie();
		with(f)	{
			var actuar = (posi.text == "");
			posi.text = x;
			if (!actuar)
				posi.moveStart("character", -x.length);
			posi.select();
		}
	}
}

function ini_editor(formu)	{
	_formulario = formu;
	
	if (op || mo)	{//alert("mozilla u opera");
		_insertar = function(f, x) {poner_mo(f, x);};
		_lector = captura_mo;
	}

else	if (otro)	{//alert("otro");
		_insertar = function(f, x) {poner_otro(f, x);};
		_lector = captura_otro;
	}

else	if (ie)	{
		_formulario.onchange = datos_ie;
		_formulario.onclick  = datos_ie;
		_insertar = function(f, x) {poner_ie(f, x);};
		_lector = captura_ie;
	}
	return formu;
}

Archivo personal.js

Código:

var elEditor;	// declaración necesaria para el funcionamiento de la librería editor.js

function ponerEmoticon(cual)	{
	_insertar(elEditor, cual);
}

hgp147 · #5 (**permalink**) 14/03/2008, 14:26

Hola caricatos, detecte un error en el editor de texto de tu web. El problema es que cuando te aparece el scrollbar lateral del textarea, y estás en la parte de más abajo del textarea, al hacer click en el emoticon se agrega correctamente en su posición, pero el problema es que el scrollbar vuelve hacia arriba de todo.
Espero haberme explicado bien. Lo probe en FIREFOX2