Pagination via des données XML à l'aide de jQuery et HTML

Question

J'ai un fichier XML qui contient une liste de questions. Je voudrais charger la première question de la liste lorsqu'une page HTML se charge et charger les réponses sous forme de boutons radio. Lorsque l'un des boutons radio est sélectionné, j'aimerais afficher les résultats ainsi qu'un bouton continuer. Le bouton continuer irait au deuxième élément dans le fichier XML.

Donc, j'ai les suivantes jusqu'ici:

function generateQuestion(i) { 
    $(document).ready(function() { 
     $.get('quiz.xml', function(d) { 
      alert('Loaded XML'); 
      $(d).find('question').get(0, function() { 
       alert('Loaded Question'); 
       var $question = $(this); 
       var questionContent = $question.attr("content"); 
       $(questionContent).appendTo("#quizQuestion"); 
      }); 
     }); 
    }); 
} 

Cependant, le contenu de la question n'est jamais chargée dans l'élément. Il semble que ça se bloque quand je vais chercher le premier élément dans le document. Je suppose qu'il n'y a pas de surcharge pour injecter l'objet dans la fonction.

Ai-je raison? Quelqu'un a-t-il des ressources rapides qui montrent un exemple type de quiz comme je cherche à générer?

MISE À JOUR: Je l'ai mis à jour le code à ce qui suit et il semble se faire prendre sur la propriété d'attribut:

function generateQuestion(i) { 
    $(document).ready(function() { 
     $.get('quiz.xml', function(d) { 
      var $question = $(d).find('question').get(i); 
      var questionContent = $question.attr('content'); 
      alert(questionContent); 
      $(questionContent).appendTo("#quizQuestion"); 
     }); 
    }); 
} 

Toutes les idées?

Answer 1

La fonction get() renvoie l'élément set non enveloppé. Dans ce cas, il s'agit de l'élément xml.

$.get('quiz.xml', function(d) { 
    var question = $(d).find('question :eq(0)'); 
    var questionContent = question.attr('content'); 
    alert(questionContent); 
    $(questionContent).appendTo("#quizQuestion"); 
}); 

l'autre alternative est de remballer l'objet

$.get('quiz.xml', function(d) { 
    var question = $(d).find('question').get(0); 
    var questionContent = $(question).attr('content'); 
    alert(questionContent); 
    $(questionContent).appendTo("#quizQuestion"); 
}); 

Aussi, je ne sais pas pourquoi votre compris le $ (document) .ready dans l'appel de fonction. Quand appelez-vous la fonction. si c'est après le chargement du document, alors vous n'avez pas vraiment besoin de ça.