拖放不能在Firefox中工作

我已经在JQuery和html5中实现了拖放功能，它在Chrome中工作得很好，但是停留在Firefox下面是我的代码，其中我警告丢弃的图像的ID，在Firefox中显示为undefined是我的代码，请帮助。的jsfiddle：http://jsfiddle.net/rajutikale/2R6p8/拖放不能在Firefox中工作

查看：

<!-- 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)); 
}

来源

2013-08-16 Zorba

似乎在这里工作得很好。什么版本的Firefox。你的控制台是否有错误？ – putvande

以及我使用22.0，我非常努力地调试它，它不会在控制台中显示任何错误，因为它不会在我的末端触发拖动事件....请建议我应该怎么做？ – Zorba

同一问题发布多次？ http://stackoverflow.com/questions/18249081/my-solution-for-drag-drop-functionality-is-not-working-in-firefox – ViliusL

火狐要求用户运行该事件的dataTransfer.setData功能。

对于你jQuery用户来说，这意味着下面的代码应该可以解决您的问题：在同一拖

function dragstartHandler(event){ 

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

}

未来事件现在会正确的触发如你预期。显然你可以用更有用的数据替换setData参数。

来源

2013-09-27 16:01:04 RandallB

嗯..我补充说，但现在每当拖动完成后，它打开一个新的标签页/窗口并转到“http://www.anything.com/”..（仅限Firefox）。我勒个去？ –

@NiCkNewman我遇到了同样的问题和[这个答案]（http://stackoverflow.com/a/14542233/2588746）修复它。需要'event.preventDefault（）'。 – xfra35

根据具有https://developer.mozilla.org/en-US/docs/Web/Events/dragstart组数据为空（如在实施例的HTML部分，或者在事件功能）：

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

铬不需要的那个。

来源

2016-12-01 14:40:51 firebird631

拖放不能在Firefox中工作

回答

相关问题