MSIE: append () / html () jQuery не работает, прибегает к getElementById (). InnerHTML

Question

Это длинный,

Помещение

Был вызван, чтобы помочь клиенту с исправлением некоторых ошибок в текущем проекте. Нужно было исправить страницу со списком вакансий. У вас есть список заданий, вы нажимаете одно, и если JavaScript активирован, выполняется вызов AJAX для динамической загрузки сведений о задании в существующий элемент (DIV # emploi_details). Если JS не активирован, он просто перезагружает страницу с деталями задания (менее важно).

Я запрыгнул на их лабораторные серверы, чтобы работать на сайте разработчика.

Проблема

По сути, IE7 (сначала) не отображал контент, загруженный через $ (). Load (). IE6 работал безотказно с innerHTML. Запросы отправляются, и я получаю ответ каждый раз. Я получаю данные, могу предупредить их и увидеть их, но фактический сброс содержимого не работает. Safari, Firefox, без проблем. Элемент DIV # emploi_details, в который я загружаю информацию, имеет отображение CSS: none; в таблицах стилей и отображается после загрузки контента (другие не столь важные детали).

show_emploi = function(id, succ_id)
{
    $('#emploi_details').fadeOut(800, function() {
        var $$ = $(this);

        $$.load('emploi_<?php echo $data['lang']; ?>.php', { job_details: 1, ajax: 1, id: id, succ: succ_id, random: (new Date().getTime()) }, function(data, status){
            if (isIE6) document.getElementById('emploi_details').innerHTML = data;
            $$.show();
        });
        $('#bgContent').fadeOut();
    });
}

Решение

Вначале у меня сложилось впечатление, что, возможно, $ (). Load () просто работает, поэтому я изменил его на $ .get () для большего контроля над манипулированием загруженным содержимым.

$.get('emploi_<?php echo $data['lang']; ?>.php', { job_details: 1, ajax: 1, id: id, succ: succ_id, random: (new Date().getTime()) }, function(data, status){
    $$.empty().append(data).show();
});

Это работает. Во всех браузерах, включая IE6 и IE7. Нет проблем. Странно, но вы знаете, работает ли он и является ли он полностью защищенным, не задавайте вопросов.

Поворот сюжета

Теперь вот где дерьмо становится странным. Я посчитал ошибку исправленной и применил решение к живому веб-сайту, и ... оно не работает. IE просто не нравится. Озадаченный после попытки $ .ajax и других вещей, я в конечном итоге использую это для живого сайта:

$.get('emploi_<?php echo $data['lang']; ?>.php', { job_details: 1, ajax: 1, id: id, succ: succ_id, random: (new Date().getTime()) }, function(data, status){
    document.getElementById('emploi_details').innerHTML = data;
    $$.show();
});

И это работает во всех браузерах, потому что нет ничего лучше, чем barebones JS, чтобы сделать вещи. Обязательно, это исправление также работает на веб-сайте разработчика.

«Продолжение следует»

В функции встраивания контента есть что-то, что работает не для всех браузеров (и, конечно, для серверов).

В общем, мой вопрос - вопрос WTF. Я не могу понять, почему один работает с одной стороны, а тот же не работает с другой стороны или даже почему он никогда не работал должным образом в начале ($ (). Load ()). Это явно не разные версии jQuery (1.2.6), так как это был мой первый инстинкт проверки версии фреймворка.

Во всяком случае, интересная загадка ИМО.

Надеюсь, у кого-то там, в Стэкленде, есть данный Богом ответ.

Спасибо

Answer 1

Я разгадал загадку! Вот рабочий пример моей проблемы. Хитрость заключалась в том, чтобы вызывать другой AJAX после первого успеха, это каким-то образом устранит проблемы с innerHTML. Спасибо, ребята, за то, что направили меня в правильном направлении.

Надеюсь, это поможет некоторым людям, потому что пока я не видел работающего решения. Я также свяжусь с jQuery для этого: P

$.ajax({
url:'modifyarticle.php',
type:'POST',
data:{
 id:this.id,
 article:'something',
 mode:'single',
 action:'delete'},
cache:false,
success:function(msg) {
 alert(msg);$.ajax({
  url:'getall.php',
  type:'GET',
  cache: false, 
  success: function(data) {
   $('#output').html(data);
  }
 });
}});

Salut

Answer 2

Я думаю, ты должен был быть там. Вот некоторые возможные точки отказа:

• jQuery.clean: функция, которая делает фрагмент, добавляемый в DOM.

  Это может быть возможно, если тип документа плохой, или если HTML-код ответа содержит ошибки это приводит к сбою функции очистки, поэтому в DOM ничего не вставляется.

• jQuery.fn.append: добавление визуализированного фрагмента ответа в DOM.

  Скажем так, потому что jQuery добавляет контент в DOM с помощью appendChild, а не innerHTML, ошибка приводит к тому, что IE не знает, что DOM изменился и не отображает сигнальные изменения. Это тогда обойдется, когда вы используете innerHTML.

  Из вашего вопроса не ясно, проверили ли вы, что введенный HTML действительно там. Это можно проверить примерно так:

  $$.empty().append(data);
  alert( $$.parent()[0].innerHTML );
  $$.show();
  

• jQuery.fn.show (): отображение результатов.

  Из вашего вопроса не ясно, является ли окончательный сбой, потому что содержание не помещается в DOM или просто не отображается? Если Контейнер имеет отступы и фон, вы это видите?

  Функция show является более сложной, чем просто добавление .style.display='block' на элемент. Элемент не будет отображаться, если он думает, что он скрыт, что иногда может делать IE есть странные идеи Заменяет ли show () ручную настройку отображения что-нибудь?

Ясно, что есть разница в том, как IE обрабатывает страницу stage / dev и живой сайт. Моими первыми шагами будет попытаться обнаружить разницу между ними. Заголовки HTTP, кодирование, типы документов, дополнительные сценарии, дополнительные CSS и даже пробелы ... Некоторое, казалось бы, незначительное отличие является причиной этой ошибки.

В любом случае, вы должны подготовить сокращенный тестовый набор только тех самых необходимых вещей, которые необходимы для воспроизведения этой ошибки. Даже если вы не нашли лекарство от него, которое вас устраивает, тестовый пример следует отправить вместе с вашим отчетом об ошибке в jQuery .