Affichage du JSON dans les zones de saisie HTML à l'aide d'AJAX?

Question

Je suis très nouveau chez AJAX et Javascript et j'ai besoin d'un peu d'aide avec ce code.

Voici le peu de JSON J'utilise

{"URL":"www.youtube.com","Total URLs":132,"Completed":63} 

Je dois obtenir chacun de ces valeurs et de l'affichage dans différentes zones de texte d'entrée HTML en utilisant AJAX.

Current URL: <input type="text" name="urlqueue"> 
Total URLs: <input type="text" name="total"> 
Completed: <input type="text" name="completed"> 

En ce moment, j'ai

ajaxRequest.onreadystatechange = function(){ 
    if(ajaxRequest.readyState == 4){ 
    document.form.total.value = ajaxRequest.responseText; 
    } 
} 
ajaxRequest.open("GET", "test_results.php", true); 
ajaxRequest.send(null); 

Vous pouvez voir cela ne fonctionne plus. J'utilise pour avoir le fichier contenant seulement 1 nombre et pas de JSON. Maintenant, j'ai besoin d'utiliser le fichier pour de nombreux résultats avec JSON et j'ai besoin de direction.

Comment afficher le JSON dans les zones de saisie HTML en utilisant AJAX?

Answer 1

Analyser le JSON, soit en utilisant une bibliothèque d'analyse JSON, soit en utilisant eval. Notez qu'utiliser eval peut être très dangereux, car vous pouvez introduire des vulnérabilités de script intersite si elles ne sont pas correctement utilisées.

L'objet résultant aura les valeurs, de sorte que vous pouvez régler individuellement par chaque champ, par exemple:

document.form.total.value = jsonObject["Total URLs"]; 

Answer 2

Notez que lorsque vous faites un AJAX et de récupérer la réponse, le texte de réponse n'est pas objet JavaScript . C'est juste une chaîne donc vous devriez évaluer la chaîne en JavaScript Object. Le code suivant produira cela rapidement. Mais Douglas Crockford qui est le maître de JavaScript dit que "eval est le mal".

 
var data = eval('(' + ajaxRequest.responseText + ')'); 
document.form.total.value = data[Total URLs] 

également je tiens à rappeler que d'éviter les espaces dans les noms de propriété. Par exemple, vous devriez avoir une propriété nommée "Total_URLs" ou "TotalURLs", etc. au lieu de "Total URLs"