Jquery i HTML FormData zwracają „Uncaught TypeError: Illegal invocation”


83

Używam tego skryptu do przesyłania plików graficznych: http://jsfiddle.net/eHmSr/

$('.uploader input:file').on('change', function() {
  $this = $(this);

  $('.alert').remove();

  $.each($this[0].files, function(key, file) {
    $('.files').append('<li>' + file.name + '</li>');

    data = new FormData();
    data.append(file.name, file);

    $.ajax({
      url: $('.uploader').attr('action'),
      type: 'POST',
      dataType: 'json',
      data: data
    });
  });
});

Ale kiedy kliknę przycisk przesyłania, konsola JavaScript zwraca ten błąd:

Uncaught TypeError: Illegal invocation 

jQuery Error

Możesz mi pomóc?


Jesteś tego pewien? dataType: 'json',???
Praveen Kumar Purushothaman

1
Tak, adres URL powróci w tym formacie.
Caio Tarifa

W moim przypadku chciałem przesłać plik jako część większego zestawu danych do kontrolera .NET MVC, który zaakceptował serializowany obiekt jako parametr swojej akcji. Konieczne było użycie obiektu FormData, co zasugerował lilalinux , a także processData: false, co zasugerował Blender , a także contentType: false , co zasugerował Caio Tarifa . Cokolwiek mniej niż wszystkie trzy nie działało. Zobacz [tę odpowiedź] ( stackoverflow.com/a/3
nbrosz

Odpowiedzi:


169

jQuery przetwarza dataatrybut i konwertuje wartości na ciągi.

DodanieprocessData: false do obiektu opcji naprawia błąd, ale nie jestem pewien, czy rozwiązuje problem.

Demo: http://jsfiddle.net/eHmSr/1/


Dzięki, ale muszę usunąć tę właściwość, zobacz to pytanie: stackoverflow.com/questions/12431760/… .
Caio Tarifa

22
Naprawiam to, po prostu dodając contentType: false. Dzięki jeszcze raz!
Caio Tarifa

@Blender Ten sam kod działa w moim systemie, ale nie u moich znajomych (obaj używają systemu Windows 10), plik nie jest wysyłany. Brak błędu w konsoli.
Suchit kumar

3
W moim przypadku problem polegał na tym, że użyłem var data = {}; Musisz jednak użyć var ​​data = new FormData ();
lilalinux

Nie mogłem zrozumieć, dlaczego to nie działa ... dopóki nie zdałem sobie sprawy, że ten proces jest zapisany jako jeden c, a nie dwa.
Yaakov Ainspan,

19

Miałem ten sam problem

Naprawiłem to, używając dwóch opcji

contentType: false
processData: false

Właściwie dodałem te dwa polecenia do mojej funkcji $ .ajax ({})


1
Czy można ich używać z $ .post? Jeśli tak to jak??
Alex


3

Moje doświadczenie:

  var text = $('#myInputField');  
  var myObj = {title: 'Some title', content: text};  
  $.post(myUrl, myObj, callback);

Problem polega na tym, że zapomniałem dodać .val () na końcu $ ('# myInputField'); ta czynność sprawia, że tracę czas na próbę ustalenia , co było nie tak, powodując błąd Illegal Invocation , ponieważ $ ('# myInputField') znajdował się w innym pliku niż ten system wskazał nieprawidłowy kod. Mam nadzieję, że ta odpowiedź pomoże innym popełniającym ten sam błąd, aby nie tracić czasu.


-2

W moim przypadku wystąpił błąd, lista parametrów nie była dobrze sformułowana. Dlatego upewnij się, że parametry są dobrze sformułowane. Np. Poprawny format parametrów

data: {'reporter': reporter,'partner': partner,'product': product}
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.