Как отобразить данные JSON на странице php? - PullRequest
0 голосов
/ 23 марта 2020

Я хотел бы отображать сообщения блога WordPress на странице php. В консоли работает следующее, но я не знаю, как отобразить результат JSON на веб-странице.

$( document ).ready(function() {

  var api_url = 'http://example.com/wordpress/wp-json/wp/v2/posts'
  $( "#portfolio-posts-container"  ).each(function( index, element ) {

    $.ajax({
      url: api_url,
      contentType: "application/json",
      dataType: 'json',
      success: function(result) {                     
        console.log(result);
      }    
    })

  });

});

Я попробовал это (используя учебник, который не соответствует мне html https://hackersandslackers.com/making-ajax-calls-with-jquery/). Я получаю сообщение об ошибке не определено, но я использую правильные ссылки, например. result.title




    success: function(result){
                $( element ).after(
                '<a href="' + result.link + '"> \n ' +
                  '<div class="link-preview"> \n ' +

                    '<div style="width:70%;" class="link-info"> \n ' +
                      '<h4>' + result.title +'</h4> \n ' +
                      '<p>' + result.excerpt +'</p> \n ' +
                    '</div><br> \n ' +
                      '<a href="' + result.link + '" class="url-info"><i class="far fa-link"></i>' + result.link + '</a> \n ' +
                    '</div></a>');
                $( element ).remove();
            }

Затем я переписал функцию, используя найденный мной учебник, но на странице получаю [object Object] [object Object]


    let url = 'https://api.github.com/orgs/emberjs/members';

    let promise = $.ajax({
    type: 'GET',
    url: url
    });

    promise.then(function(members) {
    let html = '';

    members.forEach(function(member) {
    html += `
    <img src="${member.avatar_url}" 
    width="150"
    title="${member.login}">
    `;
    });

     $('#results').html(html);

    // $('#results').json_decode(html, TRUE);


    }, function(error) {
    conole.log('error', error);
    });

Ответы [ 2 ]

0 голосов
/ 25 марта 2020

Возврат JSON ответ от AJAX с использованием jQuery и PHP:


    $( document ).ready(function() {
      var api_url = 'http://example.com/wordpress/wp-json/wp/v2/posts'
     $.ajax({
            url: api_url,
            contentType: "application/json",
            dataType: 'json',
            success: function(response){
                var len = response.length;
                for(var i=0; i<len; i++){
                    var id = response[i].id;
                    var date = response[i].date;
                    var slug = response[i].slug;
                    var excerpt = response[i].excerpt.rendered;



                    var tr_str = "<tr>" +
                        "<td align='center'>" + (i+1) + "</td>" +
                        "<td align='center'>" + date + "</td>" +
                        "<td align='center'>" + slug + "</td>" +
                        "<td align='center'>" + excerpt + "</td>" +


                        "</tr>";

                    $("#results").append(tr_str);       

            }    
            } 
        });
     });

0 голосов
/ 23 марта 2020
$(document).ready(function () {
    var api_url = 'http://example.com/wordpress/wp-json/wp/v2/posts';
    $.ajax({
        url: api_url,
        contentType: "application/json",
        dataType: 'json',
        success: function (result) {
            console.log(result);
            $.each(result, function (index, element) {
                console.log(index);
                console.log(element);
                console.log(element.id);
                console.log(element.title.rendered);
                console.log(element.content.rendered);
                console.log(element.slug);
            });
        }
    })
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...