JSONPしてみた
http://iandeth.dyndns.org/mt/ian/archives/000654.html
こちらで、jQuery JSONP plugin が公開されていたので
使ってみました。クロスドメイン対応しています。
<script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.jsonp.js"></script>
ライブラリを上記のようにして、読み込ませます。
$.getJSONP(url, コールバック関数名) function コールバック関数名() { // 処理 }
$.getJSONP() メソッドを利用するととても簡単にJSONPできる。
これはおもしろい
特徴の1つであるはずの、
2.コールバック関数を別途定義せずとも、引数に無名関数を渡すだけで手軽に利用可能。
がうまく動かなかった。なぜだ
もう少し触ってみる。
以下は、サンプルのHTML
<html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jquery.jsonp.js"></script> </head> <body> <a href="#" class="add" onclick="a()">はてダのブックマークを取得</a> <div class="hatena"></div> <script type="text/javascript"> function a(mode) { var url = "http://b.hatena.ne.jp/entry/json/?url=http%3A%2F%2Fd.hatena.ne.jp%2F&callback=hatena"; $.getJSONP(url, hatena); } function hatena(json) { $("div.hatena").append(json.title); $("div.hatena").append(":ブックマーク数"); $("div.hatena").append(json.count); $("div.hatena").append("<BR>"); $(json.bookmarks).each(function(h){ $("div.hatena").append(this.user); $("div.hatena").append(":"); $("div.hatena").append(this.comment); $("div.hatena").append("<BR>"); }); } </script> </body> </html>