IE 8 показывает необработанный ajax-ответ при перезагрузке страницы с помощью jQuery BBQ - PullRequest
5 голосов
/ 01 июня 2011

Я использую плагины jQuery BBQ и jQuery от Ben Almans для ссылок на страницы. Оба работают как положено в Opera и Firefox, но не в IE 8 (удивленно, а?). IE также хорошо работает с ajax, кнопкой возврата и hashchange, но завершается неудачно, когда я нажимаю кнопку перезагрузки и показывает raw ajax ответ вместо запуска его на ранее загруженной странице.

Итак, вот мой уродливый код и некоторые пояснения к функциям, которые я пытаюсь реализовать в своей пагинации:

1) Дружественные поисковым системам ссылки (сервер отвечает html или js в зависимости от наличия javascript на стороне клиента).

2) Динамически изменяемый URL при включении JS (с помощью символа «#»).

3) Поддержка истории и кнопки возврата.

4) Минимизация двойных запросов (не делать ajax-запрос, если тот же контент был загружен с HTML-страницей).

JS:

$(function ($) {
  if (ajax_init) {
    $('.pagination a').live("click", function () {
      $.bbq.pushState({page: $.deparam.querystring($(this).attr('href')).page});
      return false;
    });
    $(window).bind("hashchange", function(e) {
      var anchor = $.deparam.fragment().page;
      var query = $.deparam.querystring().page;
      if (ajax_load(anchor, query)) {
        $(ajax_div).css('opacity', '0.4');
        $(ajax_div + '-processing').removeClass('hidden');
        $.ajax({
          type: 'GET',
          url: $.param.querystring('', {page: anchor}),
          dataType: 'script',
          cache: false
        });
      }
    });
    $(window).trigger('hashchange');
  }
});

function ajax_load(anchor, query) {
  if ((anchor && anchor !== query && !(!query && anchor == 1)) || $('#noscript').length < 1) {
    return true;
  }
  else {
    return false;
  }
}

Шаблон (вид Rails):

<div id="products-container" >

  <div id="products-processing" class="hidden">
    <%= image_tag "spinner.gif" %>
  </div>

  <div id="products">

    <div id="noscript">
      <%= render "products_list.erb" %>
    </div>

    <script type="text/javascript">
      var ajax_init = true;
      var ajax_div = '#products';
      var anchor = $.deparam.fragment().page;
      var query = $.deparam.querystring().page;
      if (!ajax_load(anchor, query)) {
        url = anchor ? anchor : (query ? query : 1);
        $.bbq.pushState({page: url});
      }
      else {
        $('#noscript').hide();
        $('#products-processing').removeClass('hidden');
      }
    </script>

  </div>

  <div id="products-min-height"></div>

</div>

Шаблон AJAX (представление Rails js):

$('#products').html('<%= escape_javascript(render "products_list") %>').css('opacity', '1');

UPD: IE не отправляет заголовок типа запроса (или Rails не может его определить) при обновлении. Поэтому Rails генерирует JS-представление вместо HTML. Решено:

  respond_to do |format|
    request.format.js? ? (format.js {render :index}) : (format.html {render :index})
  end

Есть ли лучшее решение?

Ответы [ 2 ]

6 голосов
/ 14 ноября 2011

IE, по-видимому, запрашивает «* / *» при обновлении, а rails, похоже, считает, что javascript - лучший ответ, чем html. Поскольку обновление должно происходить только для html, сообщение rails о том, что «* / *» означает, что html устраняет эту проблему:

 before_filter :set_request_type
 ...
 protected    

 def set_request_type
   request.format = :html if request.format == "*/*"
 end
3 голосов
/ 09 февраля 2012

У меня была такая же проблема с IE8. Мой контроллер обслуживал JS, а также HTML-ответы. Для меня обеспечение того, чтобы блок формата html был отмечен первым в коде, решило проблему:

Это не работает , потому что rails отвечает шаблоном js:

respond_to do |format|
  format.js
  format.html
end

Это, однако, работает просто отлично:

respond_to do |format|
  format.html
  format.js
end
...