2013-03-15 2 views
1

나는 파일 끌어서 놓기를하는 방법을 알아 내려고하고있다. 많은 튜토리얼과 예제를 읽고 어떻게해야하는지 알고 있다고 생각합니다. 그러나 절대적인 기본 부분은 작동하지 않습니다.jquery로 파일을 삭제할 수없는 이유는 무엇입니까?

다음은 현재 가지고있는 코드입니다. 파일을 filedropper div로 드래그하면 브라우저가 드롭 경고를 보내는 대신 파일을로드합니다. 내가 뭘 놓치고 있니?

<!DOCTYPE html> 
<html> 
<head> 
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
    <script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script> 
</head> 
<body> 
    <script language='javascript'> 
    $(document).ready(function() { 
     $('#filedropper').on('drop', function(e){ 
      e.preventDefault(); 
      alert('drop'); 
      return false; 
     }); 
    }); 
    </script> 
    <div id='filedropper' style='height:100px;width:100px;background:yellow'></div> 
</body> 
</html> 

답변

2

첫 번째로, IE를 사용하는 경우 처음에는 전혀 작동하지 않습니다. IE (어쩌면 IE 10 이외)는 파일 끌어서 놓기를 지원하지 않습니다.

둘째, 당신은 .ready 잡을와 $ (문서)의로 dragOver 기능을 방지 할 필요가 : 나는 그것을 할 방법을 배우는 때

$('#filedropper').on('dragover', function(e) { 
    if (e.stopPropagation) { e.stopPropagation(); } // The if checks are excessive but safest 
    if (e.preventDefault) { e.preventDefault(); } 
}); 

This

내 주요 기준이었다.

그러면 가야합니다.

Check it out on JsBin

+0

해결했습니다. 고마워요 :) –

+0

그리고 당신이 dragenter 또는 dragleave에 가입한다면, 당신은 거기에서도 똑같이해야 할 것입니다. –

관련 문제