jqueryにおいてajaxのdoneが発火しない。

Question

いつもお世話になっております。
jqueryにおいてajaxのdoneが発火しなくて困っております。
対象のjsonデータはステータス200で読み込みは出来ているのですが、コンソールログには失敗のパターンのみ出てきます。
またjsonデータはlinterに掛けて書き損じがないか確認済みです。

この場合、どこに原因があるのでしょうか？
宜しくお願い致します。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$('#size_table div').click(function() {
  $.ajax({
    url:'data.json',
    type: 'GET',
    dataType: 'json',
  }).done(function(data){
    console.log("成功");
  }).fail(function(){
    console.log("no");
  })
});

Answer 1

エラーの詳細を表示してみてはいかがでしょうか？

}).fail(function(XMLHttpRequest, textStatus, errorThrown){
    console.log(XMLHttpRequest.status);
    console.log(textStatus);
    console.log(errorThrown);
})

Comments

[yuki_90453]

そのようにエラーを確認出来るんですね、知りませんでした。
確認した結果、パースエラーでした。
対象のデータを再度確認してみます。

Answer 2

サーバから返ってきているJSONのContent-typeは正しくapplication/jsonとなっていますでしょうか。

また、JSONの前後に余計なデータが入ってエラーとなっている可能性もあるので、ChromeのDeveloper Toolsにある「Network」で、実際に来ているデータが正しいJSONなのか確認してみる必要があるかもしれません。

Comments

[yuki_90453]

Content-typeはxhrとなっています。

Answer 3

$('#size_table div').on('click',function() {
  $.ajax({
  url:'data.json',
  type: 'GET',
  dataType: 'json',
  success:function(data){
    console.log(data);
  },
  error:function(req,text){
    console.log(text);
  },
  });
});

要求先のdata.jsonはhttpヘッダなどきちんと動作しますか？
またパースエラーなど返ってきてませんか？

Comments

[yuki_90453]

>要求先のdata.jsonはhttpヘッダなどきちんと動作しますか？
私の理解力不足で申し訳ないのですが、httpヘッダの動作確認はどのように行うのでしょうか？
デベロッパーツールでjsonファイルのエラー確認を行うという事でしょうか？

>パースエラーについて
下記のようにパースエラーを確認しましたが、ステータス200と表示されるだけでパースエラーとはなっていませんでした。
.fail(function(textStatus){
console.log("NG:" + textStatus.status);
})

[yuki_90453]

先程、パースエラーは無いと言いましたが、他の方法で確認した所パースエラーが原因でした。

Answer 4

コンソールログには失敗のパターンのみ出てきます

スクリーンショットでも貼っていただけると具体的な回答ができるかと思います。
JSONのフォーマットエラーのような気がします。

Comments

[yuki_90453]

jqueryのverは1.12使用しています。

[maisumakun]

上のソースに「1.12.4」と明記されています。

[yuki_90453]

失礼致しました、1.12.4です。