Question

这是我第一次来这里，我试图在我的页面上显示这个json文件https://eu.mc-api.net/v3/uuid/(there输入）作为格式化结果，它只显示格式化的UUID和名称，但是我在努力工作，因为我＆＃39 ;我在JS等方面表现不佳。

像：

姓名:(姓名）

UUID :(有完整的UUID）

这是我到目前为止所做的：

HTML CODE

<div id="section">
<section class="section--center mdl-grid mdl-grid--no-spacing mdl-shadow-    -2dp">
    <!-- Simple Textfield -->
<form action="#">
<div class="mdl-textfield mdl-js-textfield">
<input class="mdl-textfield__input" type="text" id="IGN">
 <label class="mdl-textfield__label" for="IGN">Enter IGN</label>

  <!-- Primary-colored flat button -->

  <div id="id01"> </div>

  <br>


  <input type="button" class="mdl-button mdl-js-button mdl-button--primary"    value="Show" onClick=" var jsonget = 'https://eu.mc-api.net/v3/uuid/' + document.getElementById('IGN').value; headrun();">

  </form>

 </section>
</div>

JS CODE

    function headrun () {
      $.getJSON( 'https://eu.mc-api.net/v3/uuid/' +    document.getElementById('IGN').value, function( data ) {
      var items = [];

      $.each( data, function( key, val ) {
         items.push( "<li id='" + key + "'>" + val + "</li>" );
      });

      $( "<ul/>", {
        "full_uuid": "my-new-list",
        "name": "my-new-list",
        html: items.join( "" )
       }).appendTo( "body" );
     });

    } 

    document.getElementById('username').innerHTML = IGN;

Answer 1

你需要做这样的事情：

$.getJSON( 'https://eu.mc-api.net/v3/uuid/' + $('#IGN').val(), function(data){
    var items = [];        
    Object.keys(data).forEach(function(key) {
         items.push( "<li id='" + key + "'>" + data[key] + "</li>" );
    });
});

Answer 2

尝试以下代码

<div id="section">
  <section class="section--center mdl-grid mdl-grid--no-spacing mdl-shadow-    -2dp">
    <!-- Simple Textfield -->
    <form action="#">
      <div class="mdl-textfield mdl-js-textfield">
        <input class="mdl-textfield__input" type="text" id="IGN">
        <label class="mdl-textfield__label" for="IGN">Enter IGN</label>

        <!-- Primary-colored flat button -->

        <script>

          function headrun() {
            $.getJSON('https://eu.mc-api.net/v3/uuid/' + document.getElementById('IGN').value, function(data) {
              $("#details ul").append('<li>Name: ' + data.name + '</li>').append('<li>UUID: ' + data.full_uuid + '</li>');
            });
          }

        </script>

        <div id="id01"> </div>

        <br>


        <input type="button" class="mdl-button mdl-js-button mdl-button--primary" value="Show" onClick="headrun();">

        <div id="details">
          <ul>
          </ul>
        </div>
    </form>

这是JSFiddle

显示JSON格式

2 个答案: