android连续拖动导致挂起的解决方法
当我保持对连续将对象拖有时在移动后56拖/滴,看到有时不获取对象还原不回来,我不能用于以后。
基本上我有对两个对象组的canvas在time可以有最大的两个图像不是更多比,也看到图像
为什么会发生呢,我们如何防止?
(function(){ varcanvas=newfabric.Canvas('canvas'); varcanvas_el=document.getElementById('canvas'); varcanvas1=newfabric.Canvas('canvas1'); vargroup; fabric.Image.fromURL('img/blank.png',function(img){ varimg1=img.set({ left:0, top:0 }); fabric.Image.fromURL('img/blank.png',function(img){ varimg2=img.set({ left:0, top:0 }); group=newfabric.Group([img1,img2],{ left:0, top:0 }); canvas.add(group) }); }); fabric.Image.fromURL('img/blank.png',function(img){ varimg1=img.set({ left:0, top:0 }); fabric.Image.fromURL('img/blank.png',function(img){ varimg2=img.set({ left:0, top:0 }); group1=newfabric.Group([img1,img2],{ left:0, top:0 }); canvas1.add(group1) }); }); $(document).ready(function(){ /*Definedraganddropzones*/ var$drop=$('#canvas-drop-area,#canvas-drop-area1'), $gallery=$('td>#image-listli'), $draggedImage=null; /*Definethedraggableproperties*/ $gallery.draggable({ helper:'clone', start:function(e){ $draggedImage=event.target; $drop.css({ 'display':'block' }) }, stop:function(){ $(this).find('img').css({ /*'opacity':0.4*/ }); $drop.css({ 'display':'none' }); $draggedImage=null; }, revert:true }); /*Definetheeventsfordroppableproperties*/ $drop.droppable({ over:function(event,ui){ $(this).addClass('active'); }, drop:function(event,ui){ varimage=$draggedImage&&$draggedImage.src; console.log($draggedImage.alt); img_to_canvas(image,$draggedImage.alt,$(event.target).is("#canvas-drop-area")?1:2); }, out:function(event,ui){ $(this).removeClass('active'); }, deactivate:function(event,ui){ $(this).removeClass('active'); } }); }); varimg_to_canvas=function(image,sendfront,checkcanvas){ varimg=newImage(); img.src=image; if(checkcanvas=='1'){ if(sendfront=='top'){ fabric.util.loadImage(img.src,function(img){ group.item(0).setElement(img); canvas.renderAll(); }); }else{ fabric.util.loadImage(img.src,function(img){ group.item(1).setElement(img); canvas.renderAll(); }); } canvas.calcOffset(); }else{ if(sendfront=='top'){ fabric.util.loadImage(img.src,function(img){ group1.item(0).setElement(img); canvas1.renderAll(); }); }else{ fabric.util.loadImage(img.src,function(img){ group1.item(1).setElement(img); canvas1.renderAll(); }); } canvas1.calcOffset(); } } })();
解决方法
更改
$drop.droppable({ over:function(event,ui){ $(this).addClass('active'); }, drop:function(event,ui){ varimage=$draggedImage&&$draggedImage.src;
为
$drop.droppable({ over:function(event,ui){ $(this).addClass('active'); }, drop:function(event,ui){ $draggedImage=ui.draggable.find("img").get(0);
以上所述就是本文的全部内容了,希望大家能够喜欢。