2

I have written the following function which adds an event listener and registers the event. Assume that this.$target holds the element id of the target element (for example: if we add event listener on div having id = 'myDiv', then this.$target will be myDiv) and this.$_ points to the target element (for example: this.$_=document.getElementById('myDiv'))

The event is registered in the following way... There is an array for each type of event listeners for an element. For ex: myDiv_click will hold all click event listeners on div having id = myDiv...Slly myDiv_mouseover will hold all mouse over event handlers of the element..Corresponding to each event ,an event id is returned by the function. Which is in the form eventType_indexInTheArray.. For example: the first mouse click event on an element will have an event id click_0

This works fine...

Now I wrote a function for removing an eventlistener. The function takes the eventId returned by $hear() as argument... But after executing it the event is not deleted.. The function is given below.. What is the bug in it?

   main.prototype.$hear = function(ev,callbackF,order)
    {
            
            if(typeof order == 'undefined' || order =='' )
            order = 0;
            
            
            order = (order == 1)?true:false;
            var a;
            
            if(!(a = (this[this.$target+ev])))//event registration
            a = ((this[this.$target+ev]) = new Array());
            
            a.push(callbackF+"_"+order);
            this.$_.addEventListener(ev,callbackF,order);
            return ev+"_"+(a.length - 1);//event Id
    }


    main.prototype.$miss = function(evId)
      {
            var ev = evId.split("_");
            var evIndex = ev[1];
            ev = ev[0];
            evId = ev;
            if((!(ev = (this[this.$target+ev]))) || ev.length-1<evIndex||evIndex<0)
            {
                
                alert("ERROR \n\n\n Event having event id   "+evId+" is not registered\n");
                return false;
            }
            else
            {
                var temp = evIndex;
                evIndex = ev[evIndex].split("_") ;
                
                this.$_.removeEventListener(evId,evIndex[0],evIndex[1]);
                ev.splice(temp,1);
            }               
    }

3 Answers 3

2

You need to pass exactly the same arguments to removeEventListener like to EventListener. Thus adequate callbackF and order.

You are not doing so.

You probably meant

evIndex = a[evIndex].split("_");

instead of

evIndex = ev[evIndex].split("_");

and wanted a to be global.

But still the issue will be that you want get your original Function back from String.

You need to rethink and redesign your code.

Simply push:

{ 
   'event_name' : ev,
   'callback' : callbackF,
   'order' : order
}

into a instead of your concatenated string.

0
1

It looks like evIndex[0] is a string which you're sending to removeEventListener instead of a reference to the function you want to remove.

I think you need something like this:

this.$_.removeEventListener(evId,callbackF,evIndex[1]);

I realise that the string evIndex[0] contains the name of the function, but removeEventListener needs an actual reference to it, not just its name in a string.

3
  • so instead of a.push(callbackF+"_"+order); is a.push(callbackF) a.push(order) and corresponding retreival in $miss is enough? Jan 30, 2012 at 17:59
  • 1
    @JinuJD better push object containing all the needed data, see my answer.
    – Krizz
    Jan 30, 2012 at 18:02
  • 2
    yeah that would work, but the edit @Krizz made to their answer is a nicer solution.
    – Howard
    Jan 30, 2012 at 18:05
0
function scaleTwo(influenceEvent){
    var slideshow=document.getElementById("step3");         
    if(influenceEvent){
        if (slideshow.attachEvent){     
            slideshow.attachEvent("on"+mousewheelevt, rotateimage)
        } else if (slideshow.addEventListener) {
            slideshow.addEventListener(mousewheelevt, rotateimage, false)
        }
    } else{
        if (slideshow.attachEvent) {
            slideshow.detachEvent("on"+mousewheelevt, rotateimage);
        } else if (slideshow.addEventListener) {
            slideshow.removeEventListener(mousewheelevt, rotateimage, false);
        }   
    }                           
}

var influenceEvent = 0;

$(window).scroll(function(event){

    if (($(document).scrollTop() > $('#step1').height()*2) && $(document).scrollTop() < $('#step1').height()*3) {

        if(flagScrollTwo) {
            scaleTwo(1);
            influenceEvent = 1;
        }
        flagScrollTwo = 0;                              
    }

    if (($(document).scrollTop() > $('#step1').height()*3) || $(document).scrollTop() < $('#step1').height()*2) {

        if(influenceEvent){
            scaleTwo(0);
           influenceEvent = 0;
        } 
    }
}
0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.