Question

嘿伙计我是这个json语法的新手，我有一个问题。我创建了一个从json中的远程服务器获取数据的函数，如下所示：

<!DOCTYPE html>
<html>
<head>

  <script type="text/javascript" src="jquery-3.1.0.min.js"></script>
  <script type="text/javascript">

    function getStates(value) {

            var data = {
                q: value
            } 

            $.ajax({
                url: 'https://something.hr/api/search',
                method: 'GET',
                headers: {'Accept': 'application/json'},
                data: data
            }).done(function(data) {
                //do something with data I returned to you
                console.log("success")
                console.log(data)


            }).fail(function(data) {
                //doSomethingWith the data I returned to you
                console.log("fail")
                console.log(data)
            });
        };



  </script>
</head>
<body>
    <input type="text" onkeyup="getStates(this.value)" >
    <br>

 <script>
</script>

</body>
</html>

我的问题是我知道如何在控制台日志中获取对象，但我希望在html中获取该对象，比如在某个框中，而不是单击它并打开他的数据（名称，ID，地址等）< / p>

Answer 1

var httpManager = (function() {
  var getData = function(value) {
    $.ajax({
      url: 'https://api.github.com/users/zixxtrth',
      method: 'GET'

    }).done(function(data) {
      //do something with data I returned to you
      jQuery('#avatar').attr('src', data.avatar_url);
      jQuery('#name').html(data.name);
      jQuery('#username').html(data.login);

    }).fail(function(data) {
      //doSomethingWith the data I returned to you
      alert('No Data');
    });
  };

  return {
    getData: getData()
  }

})();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<img src='' id='avatar' width='200' height='200' />
<h1 id='name'></h1>
<h2 id='username'></h2>

Json对象以html显示

1 个答案: