【问题标题】:SIMPLE Javascript code to display data from a single field in a Google Spreadsheet用于在 Google 电子表格中显示单个字段的数据的简单 Javascript 代码
【发布时间】:2015-04-05 05:48:43
【问题描述】:

首先,我不是专业程序员,这就是我在这里寻求帮助的原因,所以提前感谢您的时间和耐心。我需要一些代码用于网站,该网站将调用和显示来自已发布 Google 电子表格中特定字段的信息,通过 HTML、javascript 或其他类似方法显示。

环顾四周,似乎有几种方法可以做到这一点,但我能找到的所有示例和技巧都超出了我的专业知识范围,坦率地说,我在应用其中几种方法的努力都失败了。我搜索了以前的问题,但他们都引用了比我需要的复杂得多的例子。

如果有人能举一个简单的例子,我将不胜感激。 (越简单越好。)同时,我会继续尝试,看看我能做些什么。

【问题讨论】:

  • 您能否向我们展示您要求我们提供帮助的代码,以说明您的问题?要求我们将您链接到场外资源(无论该资源是什么)的问题将作为“离题”关闭。
  • 这真的取决于你对简单的定义。
  • 这确实突出了问题。我有一个通过我的谷歌帐户“发布到网络”的电子表格,我需要在框 A2 中显示文本,在我从引导模板构建的网站的正文中。这个想法是建立一个网站,我可以通过我的谷歌帐户更新信息,而不是每次我们有事件更改时都必须重新上传 html 文件。我基本上是想找出一个查询函数,它从谷歌电子表格中询问信息,然后显示它。我认为这大约是 5 行 javascript,但我已经达到了我的极限。

标签: javascript html google-sheets google-spreadsheet-api


【解决方案1】:

这是How can I access Google Sheet spreadsheets only with Javascript?的副本

但由于该示例对于初学者来说并非易事,因此这里的代码将使用上述答案中的代码显示电子表格的第二个单元格

  1. 转到https://github.com/mikeymckay/google-spreadsheet-javascript并下载文件google-spreadsheet.js
  2. 使用文本编辑器编辑该文件并更改
    • this.jsonCellsUrl = "http://this.jsonCellsUrl = "//
    • this.jsonListUrl = "http://this.jsonListUrl = "// 不要在您的页面中混合使用 http 和 https
  3. 更改下面的 var url 以指向您的工作表

FIDDLE

<!DOCTYPE html>
<html>
<head>
<title>Spreadsheet example</title>
<script type='text/javascript' src='//code.jquery.com/jquery-1.11.0.js'></script>
<script type='text/javascript' src='google-spreadsheet.js'></script>
<script type='text/javascript'>  
$(function() {

  var url = "https://spreadsheets.google.com/pub?key=0Ago31JQPZxZrdHF2bWNjcTJFLXJ6UUM5SldEakdEaXc&hl=en&output=html";

  var googleSpreadsheet = new GoogleSpreadsheet();
  googleSpreadsheet.url(url);
  googleSpreadsheet.load(function(result) {
    $('#results').html(result.data[1]); // show the 2nd (0-based) cell
  });
});
</script>
</head>
<body>
Here is the result: <span id="results"></span>
</body>
</html>

【讨论】:

  • 人力资源部。我认为,我可以看到这应该如何工作(至少以位为单位。)我已将编辑后的文本复制到我的文档的头部部分,并将结果跨度复制到正文中,我还将 .js 文件下载到同一个文件夹中作为 index.html 文件并在那里进行了两次编辑。不幸的是,这似乎并没有解决问题。无论如何,我真诚地感谢您的宝贵时间,并将继续努力解决您的问题,看看我缺少什么。
  • 按 F12 并查看控制台错误。还可以通过在$('#results").html() 行之前添加window.console&amp;&amp;console.log(result); 来查看可能的结果
猜你喜欢
  • 1970-01-01
  • 2014-08-15
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-09-21
相关资源
最近更新 更多