我如何超链接JSON API返回值与可变URL地址

How do I hyperlink JSON API return values with variable URL addresses?

本文关键字：URL 地址 返回值 API 超链接 JSON      更新时间：2023-09-26

我有一个HTML/CSS搜索栏，人们可以在其中键入关键字，点击后，我的Open States JSON API代码返回与该关键字匹配的新泽西州账单。

搜索栏截图

结果截图

我希望将返回的法案标题超链接到新泽西州立法机构网站上的页面，但我只能找到如何将返回与静态网站超链接的说明。

这是我的JavaScript代码到目前为止(与API密钥删除):

    e.preventDefault();
    // console.log($("#billID").val());
    var billSearchValue = $("#billID").val();
    if(billSearchValue=='') 
    { 
        alert("Enter Desired Query Parameters");
    } else{
        // console.log(billSearchValue);
    }
    var searchQuery = "&q=" + billSearchValue;
    var baseUrl = "http://openstates.org/api/v1/bills/?state=nj";
    var apiKey = "";
    var apiKeyParam = "&apikey=";
    var apiKeyParams = apiKeyParam + apiKey;
    var urlJSON = baseUrl + searchQuery + apiKeyParam + apiKey;
    // console.log(urlJSON);
    $.getJSON(urlJSON, function (data) {
        var billsVar = [];
        $.each(data, function(key, val) {
            billsVar.push(val);
        });
        for (var i = 0; i < billsVar.length; i++) {
            var billList = "<li>Bill <ul class='"ul-sub'">"
            var billTitle = "<li><strong>Bill Title</strong>: " + billsVar[i]['title'] + "</li>";
            var billCreatedAt = "<li><strong>Bill Created</strong>: " + billsVar[i]['created_at'] + "</li>";
            var billUpdatedAt = "<li><strong>Bill Updated</strong>: " + billsVar[i]['updated_at'] + "</li>";
            var billID = "<li><strong>ID</strong>: " + billsVar[i]['id'] + "</li>";
            var billChamber = "<li><strong>Bill Chamber</strong>: " + billsVar[i]['chamber'] + "</li>";
            var billState = "<li><strong>Bill State (Probably Don't Want/Need This)</strong>: " + billsVar[i]['state'] + "</li>";
            var billSession = "<li><strong>Bill Session</strong>: " + billsVar[i]['session'] + "</li>";
            var billType = "<li><strong>Bill Type</strong>: " + billsVar[i]['type'] + "</li>";
            var billSubjects = "<li><strong>Subjects</strong>: " + billsVar[i]['subjects'] + "</li>";
            var billBillID = "<li><strong>Bill ID</strong>: " + billsVar[i]['bill_id'] + "</li>";
            var billOutput = billList + billTitle + billCreatedAt + billUpdatedAt + billID + billChamber + billState + billSession + billType + billSubjects + billBillID + "</ul></li>";
            $("#jsonlist").append(billOutput);
        }
    });
})

});

经过一番研究，我发现账单超链接是这样的:

http://openstates.org/nj/bills/{Bill Session}/{Bill ID}/

我不能测试我的代码，因为我没有API密钥，但解决方案可以是这样的:

var billTitle = '<li><strong>Bill Title</strong>: '
    + '<a href="http://openstates.org/nj/bills/' + 
    billsVar[i]['session'] + '/' + billsVar[i]['bill_id'].split(' ').join('') + '/">'
    + billsVar[i]['title'] + '</a></li>';
相关文章：