如何使用按钮提交数据、加载新页面和加载 json 数据

Question

我正在尝试使用 api 构建一个从 API 获取 JSON 数据的应用程序，我需要在我的索引页面上有一个按钮，然后当我输入汽车注册时，信息加载到另一个页面。

我目前使用用户输入、标签和提交按钮加载信息，但我不知道如何将输入和按钮放在单独的页面上，然后加载 json 数据。 这是我到目前为止所拥有的。

<form id="vehicle-smart-sample-form">
        <label for="reg">Enter your reg</label>
        <input type="text" id="reg"/>
    <a href="stats.html"><button type="submit">Search</button></a>
    </form>
$(document).ready(function () {
        $("#vehicle-smart-sample-form").submit(function (e) {
            e.preventDefault();
            var reg = $("#reg").val();
            $.ajax({
                "async": true,
                "crossDomain": true,
                "url": "https://www.getvehiclesmart.com/rest/vehicleData?reg=" + reg + "&isRefreshing=false&appid="+myAppId,
                "method": "GET",
                "headers": {
                    "Content-Type": "application/text",
                    "Accept": "application/json",
                    "Cache-Control": "no-cache"
                }
            })
          });

Answer 1

我不完全明白，如果你想打开新的空白页并显示Json数据，你可以在ajax选项上使用它

success: function(data){
var myWindow = window.open("_blank");
myWindow.document.write("<p>"+data.property+"</p>");//for example
}

您还可以打开"stats.html"并在其中加载 JSON 数据。

success: function(data){
var myWindow = window.open("stats.html", "_blank");
myWindow.document.getElementById("car_info").innerText = data.carinfo;//for example
}