2013-10-14 1 views
0

Я использую fabric.js. Я пытаюсь загрузить изображение на холсте без кнопки отправки, изображение загружается успешно, но проблема в том, что при загрузке одного изображения его загрузка 4-х раз на холсте просто дайте мне знать, как я могу разобрать цикл после подсчета == 1Автоматическая загрузка изображения на холсте без кнопки отправки

$(document).ready(function(e) { 
$('#preview').bind('DOMNodeInserted DOMSubtreeModified DOMNodeRemoved', function(event) { 
     // alert('NotChanged'); 
     var count=0; 
     var gal_id =$(this).children('img').attr('id'); 

     if(gal_id=='upload') 

      { 
       count++; 

     // alert(count); 
     // alert(gal_src); 
      } 
      if(count==1) 
      { 
        //var gal_id =$(this).children('img').attr('id'); 
var imgInstance2 = new fabric.Image(gal_id, { 
    left: 300, 
    top: 200, 
// height:100, 
    angle: 60 
// opacity: 0.85 
}); 
// add image onto canvas 
    canvas.add(imgInstance2); 

    parent.$("#upload_image_pop_up").bPopup().close(); 


      } 



    }) 
} 

Вы можете увидеть здесь одно изображение прилагается 4 раза. enter image description here

+0

Я думаю, что вы связывая его с несколькими событиями, поэтому каждое событие вызывает функцию и объявления картина – webduvet

+0

Как я связать одно событие ?? @lombausch –

+0

... bind ('DOMNodeInserted DOMSubtreeModified DOMNodeRemoved', ... вы связываете 3 события там. Я не знаю, как вы их вызываете, но я подозреваю, что где-то есть ваша проблема. – webduvet

ответ

0

Получил ответ, следующий мой код.

$(document).ready(function(e) { 
    var flag=0; 
    $('#preview').bind('DOMNodeInserted', function(event) { 
     //$('#preview').bind('DOMNodeInserted DOMSubtreeModified DOMNodeRemoved', function(event) { 
     if(flag==0) 
      { 
    // $('#preview').bind('DOMNodeInserted DOMSubtreeModified DOMNodeRemoved', function(event) { 
     // alert('NotChanged'); 
     var count=0; 

     var gal_id =$(this).children('img').attr('id'); 
     var gal_src =$(this).children('img').attr('src'); 
     if(gal_id=='upload') 

      { 
       count++; 


     // alert(count); 
     // alert(gal_src); 
      } 
      if(count==1) 
      { 
        //var gal_id =$(this).children('img').attr('id'); 
var imgInstance2 = new fabric.Image(gal_id, { 
    left: 300, 
    top: 200, 
// height:100, 
    angle: 60 
// opacity: 0.85 
}); 
// add image onto canvas 
    canvas.add(imgInstance2); 

    parent.$("#upload_image_pop_up").bPopup().close(); 
     flag=1;  

      } 


      }  
    })