2013-09-27 19 views
25

Mam powiązane zdarzenia do różnych elementów, a kiedy przeciągam je we wszystkich przeglądarkach, oprócz Firefoksa, działa zgodnie z oczekiwaniami. W firefoxie to jednak nie działa. Jedynym zdarzeniem, które wystrzeliwuje jest dragstart i żadne inne zdarzenie nie zostanie wywołane. Co się dzieje?Dlaczego funkcja przeciągania i upuszczania HTML5 nie działa w Firefoksie?

+1

Przykładowy kod i wersja przeglądarki Firefox? –

+0

Miało to opublikować odpowiedź w tym samym czasie, ale nie ... nie wiem dlaczego. – RandallB

Odpowiedz

20

nie używam jQuery, więc usunął część originalEvent i zmienił format tekstu (lub IE miał problem), i to działa:

event.dataTransfer.setData('text', 'anything'); 

W innych wydarzeń upewnij się, aby zadzwonić:

event.preventDefault(); 

Lub przejdzie do anything.com w przypadku niektórych zdarzeń.

+3

z 'event.dataTransfer.setData ('text/html', 'anything')' to nie będzie przeskoczyć do anything.com – pykiss

+0

dla każdego, kto walczy z przeciąganiem i upuszczaniem na FF, to prawdopodobnie będzie również istotne dla ciebie, niezwiązane z tym konkretnym problemem: https: // stackoverflow.com/questions/11656061/event-clientx-show-as-0-in-firefox-for-dragend-event –

+0

Musisz również upewnić się, że wywołasz metodę preventDefault() w module obsługi zdarzeń upuszczania, aby zapobiec próbie nawigować. Nie jestem pewien, co myślała Mozilla, kiedy dokonali tej okropnej implementacji. –

24

Firefox wymaga, aby użytkownik uruchomił funkcję dataTransfer.setData w wydarzeniu.

Dla was jQuery użytkowników, co oznacza, że ​​następujący kod powinien rozwiązać problem:

function dragstartHandler(event){ 

    event.originalEvent.dataTransfer.setData('text/plain', 'anything'); 

} 

przyszłych zdarzeń na tej samej ulicy będzie teraz prawidłowo ogień, jak oczekiwano. Oczywiście można zastąpić argumenty setData bardziej przydatnymi danymi.

+1

Użyj "text" zamiast "text/plain", jeśli chcesz, aby działał w IE. Zobacz http://stackoverflow.com/questions/12803235/drag-and-drop-not-working-in-ie-javascript-html5 – David

+0

To działa, ale na dzień dzisiejszy dokumentacja Drag MDN nadal mówi, że DragEvent ma właściwość dataTransfer. Brak wzmianki o konieczności odwoływania się do originalEvent. –

+0

@LexLindsey, originalEvent jest dla jQuery, jak wskazano w odpowiedzi. – swiss196

1

Możesz użyć tego jako punktu odniesienia dla tego rozwiązania pytania dotyczącego przekierowań, które występują w przeglądarce Firefox.

Musisz zapobiec domyślnej akcji w metodzie upuszczania, aby rozwiązać ten problem.

function drop(e) { 
    if(e.preventDefault) { e.preventDefault(); } 
    if(e.stopPropagation) { e.stopPropagation(); } 

    //your code here 

    return false; 
} 

Mam to rozwiązanie od this link.

1

FF ma długie problemy z jedzeniem niektórych zdarzeń myszy, które pochodzą z elementów, które mają przepełnienie ustawione na automatyczne lub przewijanie.

W moim przypadku miałem dobrze wykorzystaną bibliotekę do przeciągania i upuszczania, która działała idealnie w próbkach i w mojej aplikacji na każdej przeglądarce, ale w Firefoksie. Po wykopaniu przez biletów związanych z tym, znalazłem rozwiązanie, które w pełni kredytową do przyczyniającym się do tego biletu https://bugzilla.mozilla.org/show_bug.cgi?id=339293

którym jest ustawiony -moz-user-select: brak

na przewijane elementem bycia przeciągnięty z. Rozwiązał mój szczególny problem.

Powiązane problemy