삭제할 때 드래그 가능한 객체의 img src를 변경하려고 시도합니다.

Question

기본적으로 .dragme (객체가 드래그 됨), .dropzone1 (삭제 될 위치) 및 일단 .dragme가되기를 원하는 이미지가 있습니다. 떨어졌다.

지금까지 그 코드는 .dragme 자리에 떨어 뜨린 후 내가 경고를 얻을, 작동, 그래서이

$(".dropzone1").droppable({ 
    accept:".dragme", 
    drop: function() { 
     alert("DROPPED"); 
    } 
}); 

있습니다. 그러나 .attr을 사용하여 .dragme의 이미지 소스를 현재 경고가있는 위치로 변경하려고 시도했습니다. 경고를 아래 코드에 입력해도 작동하지만 이미지는 여전히 변경되지 않습니다.

$(".dropzone1").droppable({ 
    accept:".dragme", 
    drop: function() { 
     $(".dragme").attr("src", "../imgs/newimage.png"); 
    } 
}); 

비슷한 질문에 대한 다른 답변을 살펴 보았지만 해결 방법이 없으므로 도움을 주시면 대단히 감사하겠습니다.

이것은 약간 jsfiddle이지만 이미지를 가져올 수는 없지만 어쨌든 30x30 PNG입니다. 나는 경보가 작동하도록 누군가가 놀이를 할 수 있고 그것을 얻을 수 있도록 빨간색 블록이 색상을 변경하거나 파란색으로 착륙 할 때 그 이미지가 훌륭해 지도록 만들었습니다.

Answer 1

이 시도 :

demo

$(".dragme").draggable(); 

$(".dropzone1").droppable({ 
    accept:".dragme", 
    drop: function(event, ui) { 
     $(".dragme").attr("src", "../imgs/newimage.png"); 
     alert($(".dragme").attr('src')); 
    } 
}); 

2 솔루션

DEMO

$(".dragme").draggable(); 

$(".dropzone1").droppable({ 
    accept:".dragme", 
    drop: function(event, ui) { 
     $(ui.draggable).attr("src", "../imgs/newimage.png"); 

    } 
}); 

서있 m drop event documentation :

This event is triggered when an accepted draggable is dropped 'over' (within the 
tolerance of) this droppable. In the callback, $(this) represents the droppable 
the draggable is dropped on. ui.draggable represents the draggable.