Le fichier Json ne se charge pas

Question

J'ai une structure de dossier comme celle-ci.

• [site]
  • [js]
  • [JSON]
    • hints.json
  • page.html

Maintenant, quand je lancer mon page.html J'ai un bouton qui quand je clique va charger mon fichier hints.json. Voici mon script pour charger le JSON.

$(function(){ 

    var jsonURL = "json/hints.json"; 
    var butt = $('.button .hints li'); 
    butt.find('a').click(function(evt){ 

    $.getJSON(jsonURL, function(value){ 
     console.log(" title = ", value.intro[0].title); 
    }); 



    }); 

}); 

Structure de fichier Json.

{ 
    "intro": [ 
       {"title": "title text", "copy": "copy text1"}, 
       {"title": "title text", "copy": "copy text1"} 
      ], 
    "active":[ 
       {"title": "Title text for page active", "copy": "copy text"} 
      ] 
} 

Quelqu'un peut-il me dire pourquoi cela ne fonctionnerait pas.

Mise à jour: Ceci a été testé localement pas à partir d'un serveur.

Voici un exemple jsfiddle même si j'essaye de le faire fonctionner localement. http://jsfiddle.net/r3bPC/1/

Answer 1

Structure de fichier Json.

{ 
    "intro": [ 
       {"title": "title text", "copy": "copy text1"}, 
       {"title": "title text", "copy": "copy text1"} 
      ], 
    "active":[ 
       {"title": Title text for page active, "copy": "copy text"} 
      ] 
} 

Dump dans http://jsonlint.com/ ....

Parse error on line 14: 
...   "title": Titletextforpageacti 
-----------------------^ 
Expecting 'STRING', 'NUMBER', 'NULL', 'TRUE', 'FALSE', '{', '[' 

Eh bien, il est votre problème.

Partie 2

Grab que JS:

$(function(){ 

    var jsonURL = "json/hints.json"; 
    butt.find('a').click(function(evt){ 

    $.getJSON(jsonURL, function(json){ 
     // $("#title").text(json.name); 
     console.log(" title = ", json.intro[0].title); 
    }); 

}); 

courir par http://jshint.com/ ...

Errors: 

Line 4 butt.find('a').click(function(evt){ 
'butt' is not defined. 
Line 1$(function(){ 
Unmatched '{'. 
Line 11}); 
Expected ')' and instead saw ''. 
Line 11}); 
Missing semicolon. 

Eh bien, il y a l'autre problème. Ps, des mégots indéfinis me font peur.

Answer 2

complet et code testé A fait,

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 
<script type="text/javascript"> 
$(function(){  
$.ajax({ 
type:'GET', 
url:'hints.json', 
dataType:'json', 
success:function(json){ 
alert(json.intro[0].title); //this alerts title text 
}, 
error:function(){ 
alert("dssdsdd"); 
} 
}); 


}); 

</script> 

ou

$.getJSON("hints.json", function(json){ 

     alert(json.intro[0].title); 
    }); 

hints.json

{ 
    "intro": [ 
       {"title": "title text", "copy": "copy text1"}, 
       {"title": "title text", "copy": "copy text1"} 
      ], 
    "active":[ 
       {"title": "Title text for page active", "copy": "copy text"} 
      ] 
} 

getJSON success callback

var jqxhr = $.getJSON("hints.json", function() { 
    alert("success"); 
    alert(json.intro[0].title); 
}) 
.success(function() { alert("second success"); }) 
.error(function() { alert("error"); }) 
.complete(function() { alert("complete"); });