2012-01-10 4 views
1

드래그 & jQuery로 HTML 5 기능 놓기를 처리하고 싶습니다. 해고되지 않는 드롭 이벤트까지는 괜찮습니다. 내 코드 좀 봐 :드래그 앤 드롭 HTML 5 jQuery : 드롭 이벤트를 발생시키는 방법?

<div id="columns"> 
    <div class="column" draggable="true"><header>A</header></div> 
    <div class="column" draggable="true"><header>B</header></div> 
    <div class="column" draggable="true"><header>C</header></div> 
</div> 

$('#columns .column').on({ 
    dragstart: function() { 
     $(this).css('opacity', '0.5'); 
    }, 
    dragleave: function() { 
     $(this).removeClass('over'); 
    }, 
    dragenter: function() { 
     $(this).addClass('over'); 
    }, 
    dragend: function() { 
     $(this).css('opacity', '1'); 
    }, 
    drop: function() { 
     alert('drop'); 
    } 
}); 

내 경보가 발생하지 않지만 드래그 엔드입니다. 드래그 앤 드롭의 차이점은 무엇입니까?

내가 jQuery를에 대해 뭔가를 발견하고 jQuery.event.props.push('dataTransfer');

내가 붙어 지금, 나는 바이올린을 만든 해요

, 누군가가 내 테스트를 완료하는 데 도움 수 있습니다 이벤트를 드롭? http://jsfiddle.net/sylouuu/bNQeJ/3/

답변

2

확인이 하나의 아웃 : 유효한 드롭 대상을 만들 마지막 dragenter 또는 dragover 이벤트에 event.preventDefault를 호출 할 필요가 this에 따르면 http://jsfiddle.net/bNQeJ/4/

.