如何使用按钮提交数据,加载新页面并加载json数据?

时间:2018-04-19 18:26:27

标签: javascript jquery json api

我正在尝试使用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"
                }
            })
          });

1 个答案:

答案 0 :(得分:0)

我完全不明白,如果你想打开新的空白页面并显示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
}