JSONPしてみた(修正版)

jQuery

コールバック関数指定のところで、"callback=callback"と
していてできていなかったorz
ドキュメントなどはよく読みましょう:-(


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, 無名関数)

$.getJSONP() メソッドを利用するととても簡単にJSONPできる。
これはおもしろい

urlに指定するcallback関数には、"{callback}"を指定しなければいけません。
プラグイン内で、無名関数を呼び出すために"{callback}"を
リネーム処理をしているからです。

実際に処理されるurl
jsonp
jsonp posted by (C)kuma8

以下は、サンプルの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={callback}";
	$.getJSONP(url, function (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>