Подчинение формы с JQuery не работает правильно с IE8

Question

jQuery $.ajax() не работает корректно с IE8, но работает с Firefox, Chrome и Safari. Я отправляю форму и ответ в формате JSON .

Вот мой код:

test.php:

<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript" src="jsFile.js"></script>

<form action='_test.php' method='post' class='ajaxform'>
 <input type='text' name='txt' value='Test Text'>
 <input type='submit' value='submit'>
</form>

<div id='testDiv'></div>

_test.php:

<?php
      $arr = array( 'testDiv' => $_POST['txt'] );
      echo json_encode( $arr );
?>

jsFile.js:

jQuery('.ajaxform').live('submit', function(event) {

 $.ajax({
        url  : $(this).attr('action'),
        type : $(this).attr('method'),
        dataType: 'json',
        data : $(this).serialize(),
        success : function( data ) {
     for(var id in data) {
      jQuery('#' + id).html( data[id] );
     }
            }
    });

 return false;
});

Поведение:

В Firefox, Chrome, Safari:

Когда я отправляю форму, тогда значение текстовое поле (txt) успешно заполняется в DIV (testDiv) без нарушения всей страницы.

В IE:

Когда я отправляю форму, она просто показывает форму json на экране следующим образом: {"testDiv":"Test Text"}

Как решить эту проблему в IE?

Спасибо.

Answer 1

Я заменил свой код jquery на этот, и он работает во всех браузерах:

jQuery(document).ready(function(){

    jQuery('.ajaxform').submit( function() {

        $.ajax({
            url     : $(this).attr('action'),
            type    : $(this).attr('method'),
            dataType: 'json',
            data    : $(this).serialize(),
            success : function( data ) {
                        for(var id in data) {
                            jQuery('#' + id).html( data[id] );
                        }
                      }
        });

        return false;
    });

});

Я не знаю, что это, но сейчас это работает. Спасибо всем за участие и помогите мне решить эту проблему.

Answer 2

1. Попробуйте изменить селектор (на input:submit или :submit)
2. Добавьте обработчик ошибок к вызову ajax и посмотрите, что он говорит

Answer 3

К вашему сведению:

Скорее, я попробовал код, который вы разместили в IE8 на Win 7 (как в режиме совместимости, так и в режиме несовместимости), и он правильно отображал «Тестовый текст» в виде простого текста внутри div, а не в формате JSON.

Answer 4

Ваш ответ JSON (вывод _test.php) должен содержать : вместо ;, как сказал @ sje397. Похоже, что другие браузеры в порядке с ;, но не IE8, поэтому значение остается строкой, а не анализируется как объект.

РЕДАКТИРОВАТЬ: по какой-то причине ваши данные не преобразуются в JSON, попробуйте ввести

if(typeof(data)=='string') {
  data=$.parseJSON(data);
}

вверху вашего success обработчика и посмотрите, работает ли он.

Answer 5

вместо

for(var id in data) {
  jQuery('#' + id).html( data[id] );
}

пытались ли вы использовать $.each()?

jQuery.each(data , function(id, val) {
  jQuery('#' + id).html( val );
});

, а также у вас неверное толкование $(this), ( Я думаю )

jQuery('.ajaxform').live('submit', function(event) {

  var $this = $(this); // add this line...

 $.ajax({
        url  : $this.attr('action'),
        type : $this.attr('method'),
        dataType: 'json',
        data : $this.serialize(),
        success : function( data ) {
     for(var id in data) {
      jQuery('#' + id).html( data[id] );
     }
            }
    });

 return false;
});

Answer 6

, вероятно, это не поможет, но, глядя на ваш код, часть, которая имеет проблемы, мне кажется больше te serialize (), чем aljax.я обнаружил, что jQuery serialize () не работает с Ajax-загруженными диалогами в IE , не совсем в вашем случае, но указывает, что отсутствие круглых скобок в ie может привести к путанице в выводе сериализации.центов.