Agregar manejador de eventos con parámetros

[mariano_donati]

Buenas. Estoy haciendo un menú. A la izquierda se muestran una serie de opciones y a la derecha, hay un panel que se va actualizando de acuerdo a la opción seleccionada. Cada opción del menu (son capas que se van anidando una debajo de la otra) tienen un ID con formato OPTION_INDICE . Guardo cada una de estas capas en un array y cada uno de los paneles que voy a mostrar en otro.
En Firefox este código funciona correctamente:

Código javascript:

var OPTION_SESSION             = 0;
var OPTION_PRIVACY            = 1;
var OPTION_VISUAL            = 2;
var OPTION_USER_DATA        = 3;
var OPTION_PERSONAL_DATA     = 4;
 
var current_option    = null;
var menu_options    = new Array();
var panels            = new Array();
 
function initialize()
{    
 
    menu_options[OPTION_SESSION] = document.getElementById('OPTION_0');
    menu_options[OPTION_PRIVACY] = document.getElementById('OPTION_1');
    menu_options[OPTION_VISUAL] = document.getElementById('OPTION_2');
    menu_options[OPTION_USER_DATA] = document.getElementById('OPTION_3');
    menu_options[OPTION_PERSONAL_DATA] = document.getElementById('OPTION_4');
 
    panels[OPTION_SESSION] = document.getElementById('PANEL_0');
    panels[OPTION_PRIVACY] = document.getElementById('PANEL_1');
    panels[OPTION_VISUAL] = document.getElementById('PANEL_2');
    panels[OPTION_USER_DATA] = document.getElementById('PANEL_3');
    panels[OPTION_PERSONAL_DATA] = document.getElementById('PANEL_4');
    
    attach_menu_option_event(OPTION_SESSION, 'click', show_panel);
    attach_menu_option_event(OPTION_PRIVACY, 'click', show_panel);
    
    show(OPTION_SESSION);
    current_option = OPTION_SESSION;
    
}
 
function show_panel()
{    
    [B]var option = parseInt(this.id.charAt(7))[/B];
    if(current_option != null)
        hide(current_option);
    current_option = option;
    show(option);    
}
 
function show(panel)
{
    panels[panel].style.display = 'block';
}
 
function hide(panel)
{
    panels[panel].style.display = 'none';
}
 
function attach_menu_option_event(option, evnt, callback)
{
        var element    = menu_options[option];
        if (element.addEventListener)      
            element.addEventListener(evnt,callback,false);
        else if (element.attachEvent)   
            element.attachEvent("on"+evnt, callback);
}
 

La línea que está en negrita es donde me falla en Internet Explorer. Esto es porque en Firefox cuando se dispara un evento, en la función que maneja este evento la palabra reservada this apunta hacia el objeto que disparo el mismo, en cambio en IE apunta al objeto window. Por lo tanto, aquí veo dos alternativas para hacer que esto funcione en ambos navegadores:
- Cuando se dispara el evento, en Internet Explorer, de alguna forma obtener una referencia a la capa que disparo el mismo.
- Pasarle un argumento, que en este caso sería el índice que ocupa la opción correspondiente cuando creo el manejador de eventos para cada opción del menú

¿Alguna idea de cómo hacerlo?.
Saludos.

[Panino5001]

Probá haciendo este reemplazo:

Código PHP:

  function attach_menu_option_event(option, evnt, callback) 
{ 
        var element    = menu_options[option]; 
        if (element.addEventListener)       
            element.addEventListener(evnt,callback,false); 
        else if (element.attachEvent){ 
            var fn=function(){ 
                callback.call(element,window.event); 
            } 
            element.attachEvent("on"+evnt, fn); 
        }   
             
}  
   

[mariano_donati]

Muchas gracias!. Me gustaría saber por que funciona ese código. Si me podés explicar estaré muy agradecido.
Saludos.

[Panino5001]

Tendrías que investigar un poco sobre los métodos call y apply. Pero básicamente, lo que hace call es ejecutar una función dada como método del objeto que se le pasa como primer argumento (el resto de los argumentos funcionarán como argumentos de ese método), y es por eso que this tiene el sentido que se espera dentro de la función.
apply es casi igual, sólo que usa sólo un segundo argumento, que es un array con los argumentos que usará el método.
Más info: http://www.librosweb.es/ajax/capitul...s_apply_y_call

[mariano_donati]

Muy buena la referencia!. Me quedé leyendo hasta recién, no solo para las funciones apply y call, sino por todo el contenido del manual.
Muchas gracias de nuevo.
Saludos.