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(backgroundImag开发者_StackOverflow中文版es[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);
}
} );
}
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');
精彩评论