[英]Ajax pagination for Instagram API tried to fix bug
我正在嘗試修復Instagram API的Ajax分頁
僅顯示了20張照片。 “加載更多”按鈕不起作用。
在控制台中:
Uncaught ReferenceError: maxid is not defined
這是index.php:
<script>
$(document).ready(function() {
$('#more').click(function() {
var max_id = $(this).data('nextid');
$.ajax({
type: 'GET',
url: 'ajax.php',
data: {
max_id: maxid
},
dataType: 'json',
cache: false,
success: function(data) {
// Output data
$.each(data.images, function(i, src) {
$('#photos').append('<li><img src="' + src + '"></li>');
});
// Store new maxid
$('#more').data('maxid', data.next_id);
}
});
});
});
</script>
<?php
require_once 'instagram.class.php';
$instagram = new Instagram(array(
'apiKey' => '*****',
'apiSecret' => '*****',
'apiCallback' => '******'
));
// Receive OAuth code parameter
$code = $_GET['code'];
if (true === isset($code)) {
$data = $instagram->getOAuthToken($code);
$instagram->setAccessToken($data);
$media = $instagram->getUserMedia();
}
?>
<ul id="photos">
<?php foreach( $media->data as $data ): ?>
<li><img src="<?php echo $data->images->thumbnail->url ?>"></li>
<?php endforeach; ?>
<?php echo "<br><button id=\"more\" data-maxid=\"{$media->pagination->next_max_id}\">Load more ...</button>"; ?>
ajax.php:
require_once 'instagram.class.php';
$instagram = new Instagram(array(
'apiKey' => '****',
'apiSecret' => '*****',
'apiCallback' => '*******'
));
// Receive OAuth code parameter
$code = $_GET['code'];
if (true === isset($code)) {
$data = $instagram->getOAuthToken($code);
// Initialize class for public requests
$instagram->setAccessToken($data);
$media = $instagram->getUserMedia();
// Receive AJAX request and create call object
$maxID = $_GET['next_max_id'];
$clientID = $instagram->getApiKey();
$call = new stdClass;
$call->pagination->next_max_id = $maxID;
$call->pagination->next_url = "https://api.instagram.com/v1/users/self/media/recent?client_id={$clientID}&max_id={$maxID}";
// Receive new data
$media = $instagram->pagination($call);
// Collect everything for json output
$images = array();
foreach ($media->data as $data) {
$images[] = $data->images->thumbnail->url;
}
echo json_encode(array(
'next_id' => $media->pagination->next_max_id,
'max_id' => $media->pagination->max_id,
'images' => $images
));
我正在使用https://github.com/cosenary/Instagram-PHP-API
謝謝!
如何更清楚:
Uncaught ReferenceError: maxid is not defined
maxid
未在您的代碼中定義。 在這一行中定義的是max_id
:
var max_id = $(this).data('nextid');
maxid
只有2個位置:
這里:
$就({
...
max_id:maxid
},
和這里:
//存儲新的maxid
$('#more')。data('maxid',data.next_id);
當您使用定義的max_id
替換這些出現時(感謝@mathieu),應該修復它。
在你的ajax.php
你有一條線:
$ maxID = $ _GET ['next_max_id'];
這與您上面的調用不對應,您有一個max_id
。 好像你混合了一些next/max/id
。 如果您查看代碼並清理這些ID,它應該可以正常工作。
看起來像
.data('nextid');
是一個粗心的錯誤,因為你的DOM中不存在這個錯誤。 除非它在其他地方,你沒有發布它。
你的意思是
.data('maxid');
?
您需要通過單擊傳遞event
參數並從event.target
獲取data
。
將第一行代碼更改為:
$('#more').click(function( event ) {
var max_id = $(event.target).data('nextid');
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.