javascript
YUI().use('io', function(Y) {
Y.one('#getItem').on('click', function(e) {
e.preventDefault();
var url = 'json.php';
Y.io(url, {
method : 'POST',
on : {
success : function(id, o) {
console.log(o.responseText);
},
failure : function() {
alert('io Error');
}
}
});
});
});
php
<html>
<head>
</head>
<title>YUI3.0サンプル</title>
<script src="http://yui.yahooapis.com/3.4.1/build/yui/yui-min.js"></script>
<script src="/sample.js"></script>
</head>
<body class="yui3-skin-sam">
<a href="" id="getItem">getItem</a></br>
</body>
</html>
これで、geItem リンクをクリックすると非同期通信が起こります。
今回は簡単な json を表示する PHP に対して通信しています。
取得した json を console に出力しています。
リクエスト前
リクエスト後
yuiドキュメント
これで、ページ遷移せずに API からデータを取得して表示などができます。
0 件のコメント:
コメントを投稿