2016-09-26 14 views
-1

私はこのjson構文で新しく、1つ問題があります。 私はこのようなJSONでリモートサーバーからデータを取得する機能を作った:Jsonオブジェクトの表示をHTMLで

<!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、住所など)それをクリックし、自分のデータを開く

+0

JSON.stringify(nullのデータは、4)との素敵な文字列の中にあなたのJSONを返します。 offset 4.それをあなたが選んだ要素に挿入することができます。 –

+0

JSONのサンプルを提供できますか? –

+0

https://jsfiddle.net/pfbd8ke6/これはコンソールログの結果です。まずオブジェクトを取得します。私が開くと、そこにはトロフィーがあります。だから今、私は良い方法でソートされたiformatiosを持っていたいです –

答えて

0

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>

関連する問題