Here is the stripped-down code that shows the problem. We have a few divs, one that is active (and can be resized and dragged). The others are inactive but can be clicked to turn them into the active item.
var currentItem=null;
function makeActive(item){
if(currentItem){
currentitem.css({borderWidth:1,zIndex:998})
.draggable('disable')
.resizable('disable')
.click(function(){makeActive($(this));});
;
}
item.css({borderWidth:3,zIndex:999})
.draggable('enable')
.resizable('enable')
;
currentItem=item;
}
Clicking back and forth between two items was fine in firefox, but IE8 would lock up (IE6/IE7 were the same). I kept stripping it down until it clicked (pun intended, sorry!). Yes, on each loop the click handler is added again. Each click handler is calling this function recursively and I think that is what locking up IE8.
The solution is simply to change the .click line to look like this:
.one('click',function(){makeActive($(this));});
That doesn't just make IE8 happy, it is also more clearly describes the click handler we want. In fact now I understand the problem I'm surprised firefox was not crashing too.
P.S. resizable('disable') does not work in JQuery 1.7; it is apparently fixed in JQuery 1.8 though.
No comments:
Post a Comment