読者です 読者をやめる 読者になる 読者になる

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>