jQuery 从整个阵列取消绑定事件

Question

Hi does anybody know how is jquery unbind function woking?I have a jquery powered photogallery where I am binding some stuff on load event(change image and so on)..But when the user is quickly walking through the gallery I want to unbind "older" events and than bind load event only on the last image. Otherwise the user will see every image he walked through for a tiny moment and I only want to show the last one..(performance, UX,..)I store every loaded(not exactly loaded, too every requested) image in an array, so everytime I call my loadImage function I call jQuery(myArrayWithImages).unbind("load.backgroundImagesLoader") but it seems it does not work, the load events are still there (its a bit weird, I cant find it in debugger, but I see it:)) Is there any way to unbind the events from whole array, or from whole js instance, except do it through foreach?

Here is some code snippet..It is whole loadImage function..

function loadImage(index , showLoading, callback){
    if(backgroundImages==undefined) backgroundImages=Array();
    //if(backgroundImages[window.location.hash][index]==undefined)backgroundImages[window.location.hash][index] = Array();

            jQuery("#galleryEl .sig_thumb a").each( function( pos , el ) {
            var wh_bg_b = getVierwportSize();
            if(index == pos){
                    var bg_img_path_b = jQuery(el).attr('href');
                    var size = 'max';
                    if ( bg_img_path_b != undefined ) {
                    if ( (wh_bg_b[0] < 1281) && (wh_bg_b[1] < 801) ) {
                        size = 'min';
                        bg_img_path_b = bg_img_path_b.substring( 0, bg_img_path_b.lastIndexOf("/") ) + "/1280/" + bg_img_path_b.substring( bg_img_path_b.lastIndexOf("/")+1 );
                    } else if ( (wh_bg_b[0] < 1441) && (wh_bg_b[1] < 901) ) {
                        size = 'med';
                        bg_img_path_b = bg_img_path_b.substring( 0, bg_img_path_b.lastIndexOf("/") ) + "/1440/" + bg_img_path_b.substring( bg_img_path_b.lastIndexOf("/")+1 );
                    }
                }


                    console.log("test");
                    if(backgroundImages[bg_img_path_b]!=undefined){
                        if(backgroundImages[bg_img_path_b].loaded=="true"){
                        //console.log(index+" "+backgroundImages[window.location.hash][index][size]['loaded']);
                        if(typeof callback=='function'){
                            callback.call(this, bg_img_path_b);
                        }   }
                        else if(backgroundImages[bg_img_path_b].loaded=="loading"){
                            jQuery(backgroundImages).unbind('load.backgroundImages');

                            jQuery(backgroundImages[bg_img_path_b]).bind('load.backgroundImages',function(){
                                backgroundImages[bg_img_path_b].loaded="true";
                                if(typeof callback=='function'){
                                    callback.call(this, bg_img_path_b);
                                    //console.log("loaded "+index);
                                }
                            });
                        }
                    }
                    else{


                    backgroundImages[bg_img_path_b]=new Image();
                    backgroundImages[bg_img_path_b].src = bg_img_path_b;
                    backgroundImages[bg_img_path_b].loaded="loading";
                    jQuery(backgroundImages).unbind('load.backgroundImages');

                    jQuery(backgroundImages[bg_img_path_b]).bind('load.backgroundImages',function(){
                        backgroundImages[bg_img_path_b].loaded="true";
                        if(typeof callback=='function'){
                            callback.call(this, bg_img_path_b);
                            //console.log("loaded "+index);
                        }
                    });
                }
                console.log(backgroundImages[bg_img_path_b]);

                //console.log(size);
                //console.log(backgroundImages);


            }


    } );

}

Answer 1

You need to unbind not like

jQuery(myArrayWithImages).unbind("load.backgroundImagesLoader")

but

jQuery(myArrayWithImages).unbind(load.backgroundImagesLoader).

Just read manual, you can use namespaces:

$('#foo').bind('click.myEvents', handler);

and

$('#foo').unbind('click.myEvents');