Internet Explorer не отображает html, возвращенный из сообщения JQuery ajax - PullRequest
Новая
       12

Internet Explorer не отображает html, возвращенный из сообщения JQuery ajax

2 голосов
/ 03 декабря 2009

У меня есть страница с полем ввода, в котором onkeyup запускает запись JQuery ajax, основанную на набранном тексте (поле поиска)

Размещенный назад HTML-код вызова ajax должен заполнить еще один div на странице.

Вот сообщение jquery ajax: 

var o = $(me.results).empty().addClass("aj3load");

$.ajax({
  type: "POST",
  dataType: "text",
  url: me.url,
  data: "cmd="+escape(me.cmd)+"&q="+q+"&"+me.args,
  cache: false,
  complete: function() {
    $(o).removeClass("aj3load");
    me.ls = q;
  },
  success: function(msg){
    $(ajax3.results)
      .html(msg)
      .find("div")
      .click(function(){
        var crs_id = $(this).find(":hidden").val();
        $(ajax3.field).val($(this).text());
        $(ajax3.vf).val(crs_id);
        $(ajax3.results).empty().slideUp("fast");
        ajax3.ls = $(this).text();
        getEventInfo();
      });
  }
});

Вот ответ на вызов ajax при поиске «eve» (для Fiddler): 

HTTP/1.1 200 OK
Cache-Control: private
Date: Thu, 03 Dec 2009 16:16:05 GMT
Content-Type: text/html
Server: Microsoft-IIS/6.0
X-Powered-By: ASP.NET
Vary: Accept-Encoding
Content-Length: 882

<div><input type="hidden" value="1000806" />111_Demo_Event_090924</div>
<div><input type="hidden" value="1000811" />123 Test Event oct 12 2009</div>
<div><input type="hidden" value="1000805" />AAA_Demo_Event</div>
<div><input type="hidden" value="1000103" />Developing Algebraic Thinking in Grades 3-5 - 30hr</div>
<div><input type="hidden" value="1000086" />Developing Algebraic Thinking in Grades K-2 - 30hr</div>
<div><input type="hidden" value="1000144" />Facilitating Oral Language Development (Grades PreK-3) - 30hr</div>
<div><input type="hidden" value="1000613" />Free PBS TeacherLine Event</div>
<div><input type="hidden" value="1000088" />Math in Everyday Life for Grades 6-8 - 15hr</div>
<div><input type="hidden" value="1000087" />Math in Everyday Life for Grades K-5 - 15hr</div>
<div><input type="hidden" value="1000163" />Using Multimedia to Develop Understanding - 30hr</div>

Теперь в Firefox и Chrome все эти div'ы отображаются нормально и красиво, но в IE только первый div отображается в контейнерном div на странице.

Есть идеи, что здесь не так с IE?

UPDATE: Если я поставлю предупреждение («Привет, мир»); после того, как я назначу вызов $ (ajax3.results) .html (msg) ... IE правильно отобразит ответ на сообщения ajax. Это не решение, возможно, некоторая помощь в отладке. Я не хочу иметь окно оповещения в середине обработки. Также я определил, что эта проблема, похоже, не влияет на IE 8, только на более ранние версии.

Спасибо

Ответы [ 9 ]

3 голосов
/ 08 декабря 2009

Это длинный выстрел, но каковы стили на ajax3.results? Возможно ли, что он имеет фиксированную высоту с переполнением: скрытый? Или вы можете столкнуться с ошибкой рендеринга ... появляются ли другие поля, если вы изменили размер браузера (чтобы вызвать перерисовку) после вызова?

3 голосов
/ 08 декабря 2009

Ajax-запросы кешируются IE. Используя ваш $. Ajax отключите кэширование. Это может быть просто еще одна причина проблемы.

3 голосов
/ 03 декабря 2009

Ваши входные теги не закрыты. Это может вызывать некоторые странности в IE.

1 голос
/ 03 декабря 2009

Проверьте ваш параметр dataType в вашем запросе. Вы ожидаете HTML, назад, верно? Попробуйте изменить это на "html".

1 голос
/ 03 декабря 2009

Я бы не стал использовать div s. Более подходящим элементом будет p. ol было бы еще лучше.

Дайте этому шанс.

index.html: 

<!doctype html>
<html>
<head>
    <meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
    <title>IE Ajax Test<title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript">
        function doit() {
            $.get('php.php',
                    function(data) {
                        $('#t').html(data);
                    }
                 );
        }
    </script>
</head>
<body>
    <p>This is a paragraph.</p>
    <p id="t">This paragraph will be replaced.</p>
    <p><input type="button" value="Do it!" onclick="doit();" /></p>
</body>
</html>

php.php: 

<?php
print("<p>text</p><p>text2</p><p>text3</p>");
?>
0 голосов
/ 26 февраля 2014

У меня возникла проблема с отсутствующими модалами в моих моделях, созданных JS, в моем приложении Rails.

Единственное, что сработало для меня, - это убрать эффект затухания, поскольку тело ответа было правильным. (https://github.com/twbs/bootstrap/issues/3672)

В моем приложении rails (haml + booststrap) я заменяю идентификатор div: "# modal-window.modal.hide.fade"

в

"# modal-window.modal.hide"

Он не нарушает Chrome, Firefox, Safari и работает в Internet Explorer.

0 голосов
/ 23 января 2011

Я тоже столкнулся с этой странной ошибкой. Это было исправлено, как только я изменил doctype на переходный со строгого и добавил в начале каждого ответа Ajax.

В другой раз я понял, что IE просто отказался принимать тег в ответе ajax. Всякий раз, когда он использует его, он удаляет все теги в ответе, оставляя только скелетный текст

Смерть IE.

0 голосов
/ 10 марта 2010

У меня тоже была эта ошибка с использованием .html () после ajax-запроса. Не удалось заставить его работать в IE6 или 7 ради любви и денег, поэтому я просто вернулся к .innerHTML. Работает нормально сейчас.

0 голосов
/ 03 декабря 2009

Вы сказали:

обратный вызов: function (msg) { . $ ( "Mydiv") HTML (MSG); } - Райан

Вам не хватает знака # перед mydiv? Также попробуйте </input>, чтобы увидеть, не ведет ли он себя иначе, чем <input />.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...