来自谷歌电子表格的 JSON 数据

Posted

技术标签:

【中文标题】来自谷歌电子表格的 JSON 数据【英文标题】:JSON data from google spreadsheet 【发布时间】:2013-04-20 07:01:24 【问题描述】:

我浏览了this fiddle,其中包含三个带有 json 数据的下拉列表。我有一个示例谷歌spreadsheet here。现在可以将此电子表格数据呈现为 fiddle 中给出的 json 格式的示例。我知道我们可以将电子表格转换为 json,

 var query = new google.visualization.Query('http://spreadsheets.google.com/tq?key=0AozvCNI02VmpdDkwR3RETmczbTI4ZFJhTXJkZHlUbEE#gid=0');
 query.send(handleQueryResponse);
 
 function handleQueryResponse(response) 
    data = response.getDataTable();
    

但是使用这个下拉菜单不起作用。

【问题讨论】:

【参考方案1】:

我不确定您的操作方式,但可以通过不同的方式完成。请使用您的示例数据查看this fiddle,并在下面查看代码。

基本上,您可以使用以下 html 脚本标签从电子表格中调用 JSON 数据。

<script src="http://spreadsheets.google.com/feeds/list/0An1-zUNFyMVLdEFEdVV3N2h1SUJOdTdKQXBfbGpNTGc/1/public/values?alt=json-in-script&amp;callback=importGSS"></script>

请注意,我正在链接到您电子表格的副本,因为它要求已发布

然后您可以使用以下脚本处理数据。

function importGSS(json)
    for(var i = 0; i < json.feed.entry.length; i++)
        var entry = json.feed.entry[i];
        $('#departments').append('<option>' + entry.gsx$subdivision.$t + '</option>');
        $('#subject').append('<option>' + entry.gsx$section.$t + '</option>');
        $('#services').append('<option>' + entry.gsx$station.$t + '</option>');
    

您显然可以适应自己的需求。

【讨论】:

我需要类似的东西。但也希望在下拉列表中使用迭代链接和唯一值。 如果没有更详细的描述,恐怕我无法想象您所追求的。我上面的代码非常简单,所以我希望它能让你走上实现目标的正确轨道 请通过this sample 在第一个下拉列表中选择 IT 时,它会在第二个下拉列表中显示其子项。同样,在选择会计时,它会显示其子项等。但在该示例中,数据是硬编码的 json。但是是否可以从 Google 电子表格数据中创建相同类型的下拉菜单? 我明白你的意思,但我没有时间编写你需要的确切代码。为了得到你想要的,我会通过附加你的第一个下拉选项来做到这一点,前提是它不存在。然后将第二个下拉选项附加到相关的第一个下拉选项的类别中,并且同样将第三个选项附加到具有关联的第二个下拉选项的类别中。然后将第二个和第三个下拉菜单中的所有选项设置为隐藏。然后选择选项后,然后将该选项的类设置为可见。希望对您有所帮助。

以上是关于来自谷歌电子表格的 JSON 数据的主要内容,如果未能解决你的问题,请参考以下文章

如何从谷歌电子表格中获取 json 数据

Json下载特定表格的链接(谷歌电子表格)

是否可以使用谷歌电子表格中的数据“预填”谷歌表单?

谷歌电子表格和谷歌应用引擎如何实现交互

插入新行时在谷歌电子表格上触发脚本

合并来自谷歌表格列的记录