Question

I am trying to dynamically add an on change event to an HTML select object. I can’t seem to get it to work. I need the function to call dropDownChange and pass two parameters, this and nextDepth.

   var nextDepth = (int)......
   var selectBox = ......
   selectBox.onchange += function(nextDepth){dropDownChange(this, nextDepth);}; 

Not really sure how to tackle this… I figured this could would work. Any help you be GREATLY appreciated.

Thanks!

Answer 1

function changeonchange(){
    var selectBox = document.getElementById("selectBox");
    var nextDepth = getIntFromSomeWhere();

    selectBox.onchange = function() {
        var targ;
        if (!e) var e = window.event;
        if (e.target) targ = e.target;
        else if (e.srcElement) targ = e.srcElement;
        if (targ.nodeType == 3) // defeat Safari bug
            targ = targ.parentNode;
        dropDownChange(targ, nextDepth);
    };
}

You can get more info about events from http://www.quirksmode.org/js/events_properties.html every time “changeonchange” is called a new scope is created to hold the local variables and that scope is carried along the new onchange handler.