2017-03-13 41 views
6

HTML Sürükle ve Bırak API'si, dragleave ve dragexit gibi iki çok benzer olayı tanımlar ve dragenter ile birlikte geçerli bırakma hedefinin izlenmesine yardımcı olur.dragexit vs dragleave - hangisi kullanılmalıdır?

Hızlı arama, iki olayın mevcut ve açık bir şekilde belgelenmesini sağlamaz; biri diğerinden diğerine kullanıldığında ve tarayıcı desteği olduğunda, burada sormam gerektiğini düşündüm.

  • her etkinliği tetiklenir gerekiyordu ne zaman HTML specification detaylı sahiptir açıklama, ancak bazı deşifre gerektirir:

    Ben bugüne kadar bulunmuş kaynaklarını paylaşacağız.

  • MDN dokümanlar (HTML Drag and Drop API ve bireysel dragexit/dragleave sayfa) söyleyerek bir yardım çok değildir "unsuru artık sürükleme operasyonun hemen seçim hedefi olduğunda dragexit olayı harekete geçirilir."/"Sürüklenen öğe veya metin seçimi geçerli bir bırakma hedefi bıraktığında dragleave olayı tetiklenir." ve dragexit için tarayıcı desteği hakkında herhangi bir bilgi sağlamayan (2017-03 itibariyle)
  • Dottoro's dragexit docs (Google'ın en iyi hitlerinden biri) güncelliğini yitirdiğini iddia ederek, "The dragexit olayı Firefox 'un 3.5 sürümünden eski olduğunu iddia ediyor. Ondragleave olayı yerine. " IE, en azından olayların sırası olma dragleave, büyük fark uygulanan ederken Gecko/Firefox başlangıçta dragexit uygulanan gibi
    • görünüyor:
    • Mozilla's bug 619703 ve W3C bug 11568 bu iki olay tarihine biraz ışık tutmak orada başvurulan dragexit yangınları Karşılık gelen dragenter önce, dragleave, karışık, sonra ateşler.
    • HTML5 özellikleri, yalnızca IE semantiği ile dragleave tanımlanmış, ancak daha sonra (~ 2013), Mozilla'nın semantiği ile dragexit eklenmiştir.
    • Gecko, orijinali dragexit ile eşanlamlı olarak Firefox 3.5 (2009) 'da dragleave uygulamış görünüyor, ancak daha sonra (4.0, ~ 2011?), Teknik özellikleriyle eşleşecek şekilde değiştiriyor.
    • caniuse
    • HTML DnD API daha çok ya da daha az modern tarayıcılarda desteklenen olduğunu gösterir, ancak Chrome 'da MDN'yi kod örneği alınmış ve yayınlanıyorduysa özellikle

cevap

10

dragexit hakkında hiçbir şey söylemez 57.0.2987.110 ve Firefox 52.0.2.

Firefox etkinlik sıra dragexit

  • dragleave
  • damla
    1. olduğunu Ama Krom dragexit olay ateş etmedim.

      Krom olay dizisidir

      1. dragleave
      2. damla

      Sonraki analiz dragexit olayı, ben diyor Mozilla XUL events bir parçası olduğunu Wikipedia öğrendim:

      ortak/W3C etkinliklerin yanı sıra

      Mozilla sen, kod parçacıkları ihtiyaç burada plunkr den dragexit ve dragleave olay pasajı olması durumunda XUL elemanları

      ile çalışır olayların bir dizi tanımlanmış.

      document.addEventListener("dragexit", function(event) { 
          console.log(event.type); 
          // reset the transparency 
          event.target.style.opacity = ""; 
      }, false); 
      
      document.addEventListener("dragleave", function(event) { 
          console.log(event.type); 
          // reset background of potential drop target when the draggable element leaves it 
          if (event.target.className == "dropzone") { 
          event.target.style.background = ""; 
          } 
      
      }, false); 
      

      DnD API tamamen tamamen tüm tarayıcılar tarafından desteklenmez dragexit olayı kullanmadan uygulanabilir olduğunu göstermektedir ilginç tutorial yoktur. Güvenli bahisiniz, tüm büyük tarayıcılar tarafından iyi bir şekilde desteklenen, dragleave etkinliğini kullanmaktır.