如何获取javascript变量的文本字段值？

Question

我需要创建一个页面，例如当用户在我的表单文本字段中输入instagram用户ID后，单击提交按钮文本字段值将传递给javascript。并显示用户的个人资料照片，无需转到另一个页面。我正在使用Instagram令牌。

var access_token = "2898196001.5b9e1e6.d2d96de78ffc4a14ade75dd6c7a07ff9";   
var user_id = "18428658";
var url = "https://api.instagram.com/v1/users/" + user_id
        + "?access_token=" + access_token + "&callback=?";   

 
$.getJSON(url, function(data) {
    $("div").append("<img src='"+data.data.profile_picture+"' />");
});
 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<fieldset>
  <h2 class="fs-title">ENTER YOUR USERNAME</h2>
  <h3 class="fs-subtitle">type your instagram username below</h3>
  <input type="text" id="uid" name="uid" placeholder="Username" />
  <input type="button" id="theButton" name="theButton" value="Next" />
</fieldset>

<div>
  <!-- Profile Picture Showing Here -->
</div>

请帮帮我。

抱歉我的英语不好。