OnMouseOver para Enlace creado "en tiempo de ejecucion"

keldrox · #1 (**permalink**) 11/03/2007, 11:04

Quiero crear una lista con unos enlaces y cada enlace tendra un evento OnMouseOver ( esto a grandes rasgos ) todos llamaran a la misma function.

Lo que quiero hacer es un objeto MainMenu, pero donde estoy teniendo problemas es en el evento OnMouseOver asi que os pongo lo mas resumido el codigo para que me ayudeis con este evento por que no me sale.

Fichero: class.iDkMainMenu.js

Código:

///////////////////////
// CLASE iDkMainMenu //
///////////////////////

function iDkMainMenu( estiloFondo, estiloVisual, iDkMainMenu )
{
	//////////////////////////
	// PROPIEDADES PÚBLICAS //
	//////////////////////////
	
	this.estiloFondo  = estiloFondo;
	this.estiloVisual = estiloVisual;
	this.iDkMainMenu  = iDkMainMenu;
	
	
	//////////////////////////
	// PROPIEDADES PRIVADAS //
	//////////////////////////
	
	this.aMain    = new Array( 30 );
	this.aSubMain = new Array( 30 );
	this.verInsertText = ( document.getElementsByTagName("body")[0].innerText != undefined ) 
						 ? true : false;
	
	
	//////////////////////
	// MÉTODOS PÚBLICOS //
	//////////////////////
	
	this.AddMain     = AddMain;
	this.OnMouseOver = OnMouseOver;
	this.Show        = Show;
}


function AddMain( idMain, nombreMain, enlaceMain )
{
	this.aMain[idMain] = idMain;
	this.aMain[idMain + ".1"] = nombreMain;
	this.aMain[idMain + ".2"] = enlaceMain;
}


function OnMouseOver()
{
	// Deberia aparecer var1.
	alert( this.estiloFondo );
}


function Show()
{
	///////////////
	// VARIABLES //
	///////////////
	
	var contAMain;
	
	
	var crear_ul = document.createElement( "ul" );
	
	for( contAMain = 0; contAMain <= this.aMain.length; contAMain++ )
	{
		if( this.aMain[contAMain] == null )
		{
			break;
		}
		
		var crear_li = document.createElement( "li" );

		var crear_a = document.createElement( "a" );
			crear_a.setAttribute( "href", this.aMain[contAMain + ".2"] );
			
			// AQUI ES DONDE RESIDE EL PROBLEMA !!!!
			crear_a.onmouseover = OnMouseOver;
			
		if( !this.verInsertText )
		{
			crear_a.textContent = this.aMain[contAMain + ".1"];
		}
		else
		{
			crear_a.innerText = this.aMain[contAMain + ".1"];
		}
		
		crear_li.appendChild( crear_a );
		crear_ul.appendChild( crear_li );
	}
		
	document.getElementById("contenedor").appendChild( crear_ul );
}

Fichero: index.html

Código:

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es">

	<head>

		<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />

	    <link href="estilo.iDkMainMenu.css" rel="stylesheet" type="text/css" />

		<script src="lib_X/x_core.js" language="javascript"></script>

		<script src="class.iDkMainMenu.js" language="javascript"></script>
		
	</head>

	<body>

		<div id="contenedor">
		
			<script>
			
				iDkMainMenu = new iDkMainMenu( 'var1', 'var2', 'var3' );
				
				iDkMainMenu.AddMain( 0, 'Archivo', '' );
				iDkMainMenu.AddMain( 1, 'Edicion', '' );
				
				iDkMainMenu.Show();
			
			</script>		
		
		</div>
	
	</body>
	
</html>

El problema esque llama "al metodo del objeto" pero aparece undefined, en vez de seguir estando en el objeto, no se si me explique bien, es como si se perdiese o tratara la function de otra forma.

Un saludo y espero que me puedan ayudar por que he probado muchas cosas como las librerias: x_event.js y Prototype, pero sigue pasando lo mismo.

JavierB · #2 (**permalink**) 11/03/2007, 11:47

Hola keldrox

Prueba poniéndolo así:

Código:

crear_a.onmouseover = function() {OnMouseOver}

Saludos,

keldrox · #3 (**permalink**) 11/03/2007, 12:02

tambien lo intente asi y no hace nada de nada, lo saque de aqui del foro. ¿Soluciones? :S!

Un saludo

Edito
--------------------

Si pongo solo

crear_a.onmouseover = function() {OnMouseOver()}

no pasaba nada, pero si pongo:

//iDkMainMenu es el nombre que le dado al objeto
crear_a.onmouseover = function() {iDkMainMenu.OnMouseOver()}

funciona perfectamente, en cambio con :
crear_a.onmouseover = function() {this.OnMouseOver()}

no hace naada...

Es muy extraño como funcionan aqui los eventos, no me gusta nada la verdad ^^!

Un saludo si alguien quiere aportar algo, se agradece.