Отображение информации о пользователе JSON - PullRequest
0 голосов
/ 07 апреля 2019

Создайте обработчик событий jQuery, который будет инициировать запрос Ajax, извлекать данные и извлекать необходимую информацию.Мне нужно отобразить имя пользователя и адрес электронной почты на основе введенного имени пользователя в <div id="results"><div id="results"> также необходимо указать, что он не может найти пользователя, если имя пользователя не найдено на основе введенных данных.

Это если пользовательский файл JSON, к которому я обращаюсь https://jsonplaceholder.typicode.com/users/

<script>
$(document).ready(function() {
$("#btnSubmit").click(function(){
    var username = $("#user").val();
    $.ajax( {
        url: 'https://jsonplaceholder.typicode.com/users/',
        method: 'GET'
    }).then(function(data) {
        $.get(username);
        $.each(data, function(index, user) {
            if (user['username'] == username) {
                $('#results').text(''+ user.name +' ('+user.email +')');
            } else {
                $('#results').text('Sorry, no user could be found with the username '+ username+ '');
            }


        });

    });
}); 
});
</script>

Я могу найти пользователей по имени пользователя, но не могу понять, каким будет мой следующий шаг, чтобы получить эти имена пользователей и адрес электронной почты.

1 Ответ

0 голосов
/ 07 апреля 2019

Вам не нужен $ .get (), а просто используйте цикл JS. Этот фрагмент работает:

$(document).ready(function() {
    $("#btnSubmit").click(function(){
        var username = $("#user").val();
        $.ajax( {
            url: 'https://jsonplaceholder.typicode.com/users/',
            method: 'GET'
        }).success(function(data) {

            // Data is an array, let loop through each, to get object data
            for (var i = 0; i < data.length; i++) {

                // Get object's property values
                var dataUsername = data[i].username;
                var dataUserEmail = data[i].email;

                // Output user data if user is matched
                if(dataUsername.toLowerCase() == username.toLowerCase()){
                    $('#results').text(dataUsername + ' ' + dataUserEmail);
                }
            }
        });
    }); 
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...