jQuery, jSon et IE8, ne fonctionnent pas correctement 100%

Question

J'utilise un fichier PHP backend pour rassembler mes données de la base de données et utiliser jquery pour afficher les informations.

Tout va bien dans Firefox et IE9, mais dans IE8, le premier résultat n'est pas affiché à 100%, seulement la moitié des informations est affichée sans aucun balisage.

J'ai vérifié tous les guillemets, les virgules et autres caractères sur lesquels IE voyage, mais rien pour l'instant. La question est, pourquoi le code ci-dessous ne fonctionne pas à 100% sur IE8?

Code JS:

function addInfo(data) { 
    var x = 0; 
    var content = ''; 
    var land; 

    $.each(data.gebieden, function(i,info){ 
     y = info.id; 
     land = landen_array[info.lid]; 

     content += '<li>'; 
     content += '<a class="price" href="' +info.url+'" target="_blank">'; 
     content += '&euro; '+info.prijs+''; 
     content += '</a>'; 
     content += '<img src="/images/accommodatie/small/'+ info.image +'.jpg" alt="'+info.naam+'" class="result_image"/>'; 
     content += '<h3>'+info.naam+'</h3>'; 
     content += '<h4 class="au"><img src="/images/'+land+'.png" class="flag_small"> | '+info.gebied+' | '+info.dorp+'</h4>'; 
     content += '<dl>'; 
     content += '<dt>Gebied</dt>'; 
     content += '<dd>'; 
     content += '<ul>'; 
     content += '<li>'+info.min_hoogte+' - '+info.max_hoogte+'m</li>'; 
     content += '<li>'+info.pistes+' km pistes</li>'; 
     content += '<li>Gaaf gebied</li>'; 
     content += '</ul>'; 
     content += '</dd>'; 
     content += '<dd>'; 
     content += '<details>'; 
     content += '<summary>'; 
     content += '<a class="leesmeer" id="detail_layer1_'+ y +'">Lees Meer</a>'; 
     content += '</summary>'; 

     content += '<div class="gebiedinformatie" id="layer1_'+ y +'">'; 
     content += '</div>'; 

     content += '</dd>'; 
     content += '</dl>'; 

     content += '<dl>'; 
     content += '<dt>Dorp informatie</dt>'; 
     content += '<dd>'; 
     content += '<ul>'; 
     content += '<li>'+info.afstand_utrecht+' km tot Utrecht</li>'; 
     content += '<li>Retourneren</li>'; 
     content += '<li>Klachten</li>'; 
     content += '<li>Contact</li>'; 
     content += '</ul>'; 
     content += '</dd>'; 
     content += '<dd>'; 
     content += '<details>'; 
     content += '<summary>'; 
     content += '<a class="leesmeer" id="detail_layer2_'+ y +'">Lees Meer</a>'; 
     content += '</summary>'; 

     content += '<div class="dorpinformatie" id="layer2_'+ y +'">'; 
     content += '</div>';    

     content += '</dd>'; 
     content += '</dl>'; 

     content += '<dl>'; 
     content += '<dt>Accomodatie</dt>'; 
     content += '<dd>'; 
     content += '<ul>'; 
     content += '<li>Dorp id '+ y +'</li>'; 
     content += '<li>Privacystatement</li>'; 
     content += '<li>Algemene voorwaarden</li>'; 
     content += '</ul>'; 
     content += '</dd>'; 
     content += '<dd>'; 
     content += '<details>'; 
     content += '<summary>'; 
     content += '<a class="leesmeer" id="detail_layer3_'+ y +'">Lees Meer</a>'; 
     content += '</summary>'; 

     content += '<div class="accomodatieinformatie" id="layer3_'+ y +'">'; 
     content += '</div>'; 

     content += '</dd>'; 
     content += '</dl>'; 
     content += '</li>'; 

     x = x+1; 
    }) 
    $("#results").empty(); 

    // update pagination information 
    // 
    var pagina_info = data.pagina; 
    if (pagina_info.aantal_resultaten > 0) { 
     var tot_aantal = pagina_info.max_per_page * pagina_info.current_pag; 
     var vanaf_aantal = ((pagina_info.current_pag-1) * pagina_info.max_per_page) + 1; 

     var pag = '<div id="Pagination" class="pagination">'; 
     for(i=1;i<=pagina_info.totaal_aantal_pag;i++) { 
      if (i != pagina_info.current_pag) { 
       pag += '<a href="#" id="pag_'+i+'" class="page_no">'+i+'</a>'; 
      } else { 
       pag += '<span class="current">'+ i +'</span>'; 
      } 
     } 
     pag += '</div><br>'; 
    } else { 
     var tot_aantal = 0; 
     var vanaf_aantal = 0; 
    } 

    info = "Resultaat "+ vanaf_aantal+ " tot "+ tot_aantal +" van "+pagina_info.aantal_resultaten+" resultaten."; 
    $("#results").append(info).append(pag); 
$("#resultaten").append(content); 

}

Les informations JSON renvoyer pour remplir ci-dessus:

{ 
"gebieden": 
    [{ 
     "id":"19", 
     "naam":"Appartementen Gletscherpanorama", 
     "lid":"1", 
     "min_hoogte":"753", 
     "max_hoogte":"3029", 
     "prijs":"79.00", 
     "url":"http:\/\/ds1.nl\/c\/?wi=127251&si=2374&li=146991&dl=oostenrijk\/zell_am_see-kaprun\/kaprun\/appartementen_gletscherpanorama.htm&ws=", 
     "pistes_groen":"0", 
     "pistes_blauw":"57", 
     "pistes_rood":null, 
     "pistes_zwart":null, 
     "pistes":"138", 
     "gebied":"Zell am See - Kaprun", 
     "gid":null, 
     "dorp":"Kaprun", 
     "afstand_utrecht":"966", 
     "image":"accom_small_19" 
    }, 
    { 
     "id":"30", 
     "naam":"Appartementen Mariandl & Dependance", 
     "lid":"1", 
     "min_hoogte":"753", 
     "max_hoogte":"3029", 
     "prijs":"94.00", 
     "url":"http:\/\/ds1.nl\/c\/?wi=127251&si=2374&li=146991&dl=oostenrijk\/zell_am_see-kaprun\/piesendorf\/appartementen_mariandl__dependance.htm&ws=", 
     "pistes_groen":"0", 
     "pistes_blauw":"57", 
     "pistes_rood":null, 
     "pistes_zwart":null, 
     "pistes":"138", 
     "gebied":"Zell am See - Kaprun", 
     "gid":null, 
     "dorp":"Piesendorf", 
     "afstand_utrecht":"966", 
     "image":"accom_small_30" 
    }], 
"pagina": 
    { 
     "pages_before":"1", 
     "pages_after":0, 
     "max_per_page":"10", 
     "current_pag":1, 
     "totaal_aantal_pag":4, 
     "aantal_resultaten":33 
    } 
} 

Et en dernier, le codage HTML:

<ul class="resultaten" id="resultaten"></ul> 

Any questions/informations supplémentaires nécessaires, s'il vous plaît faites le moi savoir.

P.s. toute amélioration du code est toujours la bienvenue.

Answer 1

Utilisez-vous quelque chose pour activer HTML5?

Balises comme: <details>, <summary> ne sont pas encore pris en charge et ne sera pas affiché correctement dans < = IE8

Voir le lien suivant pour plus d'informations et vous pouvez trouver un activateur HTML5 pour les navigateurs qui ne supportent pas encore la tags: http://html5doctor.com/how-to-get-html5-working-in-ie-and-firefox-2/