javascript - 我的拖放功能解决方案在Firefox中不起作用

我正在将简单的拖放功能实现到我的网站中。根据图像的拖放效果，它可以正常工作。但是，现在我想将删除的图像保存到服务器中。为此，我已经将视图中的图像数据作为隐藏元素包括在内，要在jQuery中访问此数据，我需要删除图像ID。我试图从下面的代码中获取它，它在chrome中效果很好，但在Firefox中却不行，请帮助：

码：

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

最佳答案

http://jsfiddle.net/TFv3a/

<a id="dragable" style="display:block;width:100px;height:100px;border:1px solid red;">Drag here</a>

document.getElementById('dragable').ondragover = function(e){e.preventDefault();  }
document.getElementById('dragable').ondrop = function(e){ upload_drop(e); }


function upload_drop(e){
e.preventDefault();
alert('drag and drop works.');
}

关于javascript - 我的拖放功能解决方案在Firefox中不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/18249081/