Я пытаюсь исправить разбиение на страницы Ajax для API Instagram
Показаны всего 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');
Это выглядит как
.data('nextid');
является неосторожной ошибкой, поскольку этого не существует в вашей DOM. Если это не где-то еще, и вы не разместили его.
Вы имели в виду иметь
.data('maxid');
?
Есть только 2 местоположения с maxid :
Вот:
$ .ajax ({
…
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 . Если вы просматриваете свой код и очищаете эти идентификаторы, он должен работать.
Вам нужно передать аргумент event щелчком и получить data из event.target .
Измените первые строки кодов на это:
$('#more').click(function( event ) { var max_id = $(event.target).data('nextid');