$ .ajax post działa w Chrome, ale nie w Firefox

Question

OK, będę krótki. Mam ten skrypt, który umieszcza wartości w bazie danych. Działa doskonale w Chrome, Safari, ale nie może działać w przeglądarce Firefox ani IE. Wydaje się, że dane nie są nawet wysyłane do pliku .php, a ajax wcale się nie uruchamia. Ktoś, proszę?

To jest mój skrypt jquery:

$(document).ready(function(){ 
$("#dodaj").click(function(){ 
    event.preventDefault(); 
    var kategorija = $("#kategorija option:selected").val(); 
    var si = $("#si").val(); 
    var hu = $("#hu").val(); 
    var de = $("#de").val(); 
    var an = $("#an").val(); 
    var hr = $("#hr").val(); 

$.ajax({ 
    type: "POST", 
    url: "dodaj_v_bazo.php", 
    data: {"kategorija": kategorija, "si": si, "hu": hu, "de": de, "an": an, "hr": hr}, 
    success: function(data){ 
     alert("Jed uspešno dodana."+data); 
    }, 
}); 
return false; 
}); 
}); 

To jest zawartość w moim pliku php:

$kategorija = $_POST['kategorija']; 
$si = $_POST['si']; 
$hu = $_POST['hu']; 
$de = $_POST['de']; 
$an = $_POST['an']; 
$hr = $_POST['hr']; 

$dodaj_v_bazo = "INSERT INTO jedi (kategorija, si, hu, de, an ,hr) VALUES ('$kategorija', '$si', '$hu', '$de', '$an', '$hr')"; 
mysql_query($dodaj_v_bazo) or die(mysql_error()); 

Answer 1

Nie określić event jako parametr procedury obsługi zdarzenia, stąd w

event.preventDefault(); 

przeglądarka próbuje wyszukać event w zasięgu globalnym. Chrome udostępnia obiekt zdarzenia w zasięgu globalnym (stąd brak błędu), ale Firefox go nie obsługuje (stąd błąd).

Sugeruję, aby dodać parametr event do obsługi zdarzeń:

$("#dodaj").click(function(event){ 
    event.preventDefault(); 
    // ... 
}); 

istnieje dodatkowa różnica: Jeśli nie zdefiniować parametr event, event skieruje do natywnego imprezy obiekt w Chrome, który jest inny niż the event object which jQuery passes to the handler.

Aby uzyskać więcej informacji na temat obsługi zdarzeń za pomocą jQuery, polecam przejść przez these articles.

Answer 2

Połączenie asynchroniczne może nie działać w FF, jeśli zostało wywołane podczas przesyłania formularza. Możesz dodać async: false do twojego wywołania ajaxowego i to zadziała. Jest tak albo fakt, że masz połączenie między domenami, które będziesz musiał naprawić przez CORS.

Answer 3

Firefox z brakiem połączenia asynchronicznego $ajax został naprawiony w przeglądarce Firefox v49.0.2 i nowszych.

$(document).ready(function(){ 
$("#dodaj").click(function(){ 
    event.preventDefault(); 
    var kategorija = $("#kategorija option:selected").val(); 
    var si = $("#si").val(); 
    var hu = $("#hu").val(); 
    var de = $("#de").val(); 
    var an = $("#an").val(); 
    var hr = $("#hr").val(); 

$.ajax({ 
    type: "POST", 
    url: "dodaj_v_bazo.php", 
    data: {"kategorija": kategorija, "si": si, "hu": hu, "de": de, "an": an, "hr": hr}, 
    success: function(data){ 
     alert("Jed uspešno dodana."+data); 
    }, 
}); 
return false; 
}); 
}); 

Powyższy kod będzie działał po uaktualnieniu do przeglądarki Firefox v49.0.2 lub nowszej.