Firefox에서 드래그 앤 드롭이 작동하지 않습니다

Question

JQuery와 html5에서 끌어서 놓기 기능을 구현했습니다. Chrome에서 작동하지만 Firefox에서 멈추었습니다. 다음 코드는 Firefox에서 정의되지 않은 것처럼 보이는 이미지의 ID를 경고하는 코드입니다. 제 코드입니다, 제발 도와주세요. jsfiddle : http://jsfiddle.net/rajutikale/2R6p8/

보기 :

<!-- dragable image --> 
<a href="#?w=976" rel="popup1" id="<?=$album['album_id'].'-'.$data->content_id?>" class="poplight album_photos"><img id="<?=$album['album_id'].'-'.$data->content_id?>" draggable="true" ondragstart="drag(event)" ondragover="allowDrop(event)" alt="" src="<?=$imagePath?>"></a> 

<input type="hidden" id="<?='wall'.$data->content_id?>" value="<?=$data->wall_id?>" /> 
<input type="hidden" id="<?='type'.$data->content_id?>" value="<?=$data->content_type?>" /> 
<input type="hidden" id="<?='user'.$data->content_id?>" value="<?=$_SESSION['user_type']?>" /> 

<!-- dropable area --> 
<div class="" style="z-index: 1; position:fixed; right:124px; top:60px" id="div1" ondrop="drop(event);;" ondragover="allowDrop(event);"> <a href="#"><img id="dropzon_image"src="<?php echo IMAGE_PATH_HTTP?>babbler_btn.jpg" alt="" border="0" style="cursor: pointer; cursor: hand; "/></a> 
    <div id="overlay" style="display:none;z-index: 2; position:fixed; right:0px; top:32px; cursor: pointer;border-color: blueviolet;"> 
     <img id="drop_image" src="<?php echo IMAGE_PATH_HTTP?>drop_image.jpg" alt="" border="1" style="cursor: pointer; cursor: hand; " /> 
    </div> 
</div> 

JS :

function allowDrop(ev) { 
    ev.preventDefault(); 
} 

function drag(ev) { 
    ev.dataTransfer.setData("Text", ev.target.id); 
    $("#div1").find("#overlay").slideDown(); 
    setTimeout(function() { 
     $("#overlay").hide(); 
    }, 4000); 
} 

function drop(ev) { 
    var id = ev.dataTransfer.getData("Text"); /*implimented solution*/ 
    alert(id); 
    ev.preventDefault(); 
    var action = 'download'; 
    var wall_id = '62'; 
    var stat = 'Album'; 
    var cnt = '0'; 
    var user_type = 'R'; 
    var status = do_download(action, wall_id, stat, cnt, user_type); 
    $("#overlay").hide(); 
    // ev.target.appendChild(document.getElementById(data)); 
} 

Answer 1

파이어 폭스는 사용자가 이벤트에 dataTransfer.setData 기능을 실행하는 것이 필요합니다. 예상대로 같은 드래그에

function dragstartHandler(event){ 

    event.originalEvent.dataTransfer.setData('text/plain', 'anything'); 

} 

미래 이벤트가 정상적으로 실행됩니다 : 당신 jQuery 사용자의

, 즉 다음과 같은 코드가 문제를 해결해야 의미합니다. 분명히 setData 인수를보다 유용한 데이터로 대체 할 수 있습니다.

Answer 2

와 NULL로 (예 HTML의 부분에서, 또는 이벤트 함수 등) https://developer.mozilla.org/en-US/docs/Web/Events/dragstart 세트 데이터에 따르면

event.dataTransfer.setData('text/plain', null); 

크롬이 필요 없다.