ক্রোমে ফায়ার হচ্ছে না এমন ইভেন্ট ড্রপ করুন

Question

মনে হচ্ছে ড্রপ ইভেন্টটি ট্রিগার করছে না যখন আমি আশা করব।

আমি ধরে নিই যে ড্রপ ইভেন্টটি আগুন নেমেছে যখন একটি উপাদান যখন টেনে আনা হচ্ছে তা লক্ষ্য উপাদানটির উপরে প্রকাশিত হয়, তবে এটি ক্ষেত্রে মনে হয় না।

আমি কী ভুল বুঝছি?

http://jsfiddle.net/LntTL/

$('.drop').on('drop dragdrop',function(){
    alert('dropped');
});
$('.drop').on('dragenter',function(){
    $(this).html('drop now').css('background','blue');
})
$('.drop').on('dragleave',function(){
    $(this).html('drop here').css('background','red');
})

Comments

সদৃশ প্রশ্ন: স্ট্যাকওভারফ্লো

— বব

সম্ভাব্য উত্তর: stackoverflow.com/questions/8414154/…

— বব

Answer 1

অর্ডার ড্রপ ঘটনা একটি div উপাদান ঘটতে আছে করার জন্য, আপনি বাতিল করতে হবে ondragenterএবং ondragoverইভেন্ট নেই। Jquery এবং আপনার কোড সরবরাহ করা ব্যবহার করে ...

$('.drop').on('drop dragdrop',function(){
    alert('dropped');
});
$('.drop').on('dragenter',function(event){
    event.preventDefault();
    $(this).html('drop now').css('background','blue');
})
$('.drop').on('dragleave',function(){
    $(this).html('drop here').css('background','red');
})
$('.drop').on('dragover',function(event){
    event.preventDefault();
})

আরও তথ্যের জন্য, MDN পৃষ্ঠাটি দেখুন ।

Comments

আপনার অনড্রেজেন্টারের দরকার নেই, কেবল অনড্রাগোভার।

— অ্যাক্সেস_গ্রান্টেড

এখনও যেতে নেই, অন্তত সর্বশেষ Chrome এ চিত্রগুলি টেনে আনার সময়।

— নোব্যাগস

এখনও সর্বশেষ ক্রোমিয়াম (ভিভালদি 1.2.490.39 () (32-বিট) jsfiddle.net/f282n3pt/3

— mcsdwarken

রিঅ্যাক্টজ সহ, আপনাকে একই এলিমে অনড্রাগ ওভার হ্যান্ডলার যুক্ত করতে হবে।

— চ্যান

এইচটিএমএল 5 ডিএনডি এপিআই কি আসলেই খারাপ?

— bartosz.baczek

Answer 2

আপনি শুধু একটি করছেন পার পেয়ে যাবে event.preventDefault()উপর dragoverইভেন্ট। এটি করা dropঘটনাকে আগুন ধরিয়ে দেবে ।

Comments

যে একটি অনাবৃত প্রান্তের মামলা আছে, আপনি অবশ্যই ড্রেজেটারে e.preventDefault () কল করতে হবে, আমার অন্যান্য মন্তব্য দেখুন

— zupa

Answer 3

ড্রপ ইভেন্টটি চালিত হওয়ার জন্য, আপনাকে ওভার ইভেন্টের সময় একটি ড্রপএফেক্ট বরাদ্দ করতে হবে, অন্যথায় অনড্রপ ইভেন্টটি কখনই ট্রিগার হবে না:

$('.drop').on('dragover',function(event){
    event.preventDefault();
    event.dataTransfer.dropEffect = 'copy';  // required to enable drop on DIV
})
// Value for dropEffect can be one of: move, copy, link or none
// The mouse icon + behavior will change accordingly.

Comments

আসলে আপনার করা দরকার event.originalEvent.dataTransfer.dropEffect = "copy"কারণ jQuery এর নিজস্ব ব্যবহার করেevent

— AymKdn

Answer 4

এটি প্রকৃত উত্তর নয় তবে আমার মতো কিছু লোকের পক্ষে যারা ধারাবাহিকতার জন্য শৃঙ্খলার অভাব বোধ করেন। ক্রমটিতে আমার জন্য effectAllowedড্রপটি আগুন জ্বলত না যখন আমি যে প্রভাবটি সেট করেছিলাম তা নষ্ট না করে dropEffect। এটি অবশ্য সাফারিতে আমার পক্ষে কাজ করেছিল। এটি নীচের মত সেট করা উচিত:

ev.dataTransfer.effectAllowed = 'move';

বিকল্পভাবে, effectAllowedহিসাবে সেট করা যেতে পারে all, তবে আমি যেখানে বলতে পারি সুনির্দিষ্টতা রাখতে পছন্দ করি।

একটি ক্ষেত্রে যখন ড্রপ এফেক্টটি সরানো হয়:

ev.dataTransfer.dropEffect = 'move';