javascript — Ajax и json_encode отображают текст вместо json в Firefox

Question

javascript — Ajax и json_encode отображают текст вместо json в Firefox

У меня есть небольшой скрипт, который возвращает стоимость доставки в HTML, из PHP / CodeIgniter.

Вот код PHP с некоторыми примерами данных для массива:

public function atualiza_frete_ajax() {

$response_array = array(
'html_select_frete' => "<form><select><option></option></select></form>");
header("Content-Type: application/json", true);
echo json_encode($response_array);
}

И JS / JQuery

      function atualizar_frete_ajax() {
var $form = $("#form-cep");
$(".loading").fadeIn();
$.ajax({
type: $form.attr("method"),
url: $form.attr("action"),
dataType: "json",
data: $form.serialize()
}).done(function(data){
$(".frete-valor").html(data.html_select_frete)
$(".loading").hide()
});
event.preventDefault();
}

Теперь проблема в том, что он отлично работает в Chrome, но в Firefox я просто получаю этот неприятный текстовый вывод.

Вот распечатка экрана того, как FF выводит это: http://prntscr.com/5cfcgc

Я удостоверился, что кодировка файла — UTF8, а не спецификация, и я использую правильный заголовок, прежде чем повторить ответ.

Есть какие-нибудь подсказки?

0

ajax codeigniter firefox javascript php

Решение

Другие решения

Других решений пока нет …

Источник

Accepted Answer

Это не работает, потому что вы не препятствует поведению по умолчанию. event.preventDefault() правильно, но вы должны использовать его правильно. Если вы хотите выполнить этот запрос AJAX в момент отправки формы, вы должны использовать что-то вроде этого:

    $(document).on('submit', '#form-cep',function(e)
{
e.preventDefault();
var $form = $(this);
$(".loading").fadeIn();
$.ajax({
type: $form.attr("method"),
url: $form.attr("action"),
dataType: "json",
data: $form.serialize()
}).done(function(data){
$(".frete-valor").html(data.html_select_frete)
$(".loading").hide()
});
});

Также с этим приложением вы больше не получите ошибку FireFox.

РЕДАКТИРОВАТЬ

Если вам также нужно это как функция, вы можете использовать это:

function atualizar_frete_ajax()
{
var $form = $("#form-cep");
$(".loading").fadeIn();
$.ajax({
type: $form.attr("method"),
url: $form.attr("action"),
dataType: "json",
data: $form.serialize()
}).done(function(data){
$(".frete-valor").html(data.html_select_frete)
$(".loading").hide()
});
}$(document).on('submit', '#form-cep',function(e)
{
e.preventDefault();
atualizar_frete_ajax();
});

1