【发布时间】：2016-06-29 17:38:42
【问题描述】：
我整理了一个简单的 jQuery/JavaScript 弹出窗口。使用 AJAX，我想从可公开访问的 Google 电子表格中的单元格填充弹出窗口的内容。我能做的就这么多，而且我已经成功地从 Google 电子表格中抓取了 json 格式的数据。
问题是我需要访问的内容位于不同的“工作表”中。我不太了解 Google Docs，也不知道如何“激活”不同的工作表。我要激活的一张表的名称是“FG”。另一个是“SA”。
我找到了一个类似以下的 JS 函数并将其放入我的代码中，但在进一步阅读之后，似乎应该通过转到 spreadsheet > Tools > Script editor... 将这个函数放入 Google 电子表格中。
function goToSheet(sheetName) {
var sheet = SpreadsheetApp.getActive().getSheetByName(sheetName);
SpreadsheetApp.setActiveSheet(sheet);
}
所以我使用我想要加载的“工作表”的名称调用该函数作为我的 JS 中 AJAX 调用成功中的参数值，并且该函数没有加载。
我的 index.html 文件中的 jQuery/JavaScript 如下：
/**
* Redirect Function
*/
var appRedirect = (function(){
var global = {};
var base = {};
/**
* AJAX Processing Elements
* val: 'before','complete'
* ************************************************************* */
global.ajaxProcessingElems = function (val) {}
/**
* Popup Init
* type: content,buttons
* pClass: unique selector name for popup
* maxWidth: the maximum width value for the popup
* pTitle: title of the popup
* data: the data passed to the popup
* appSiteUrl: the site application to direct user to
* ************************************************************* */
global.popupModalInit = function (type, pClass, maxWidth, pTitle, data, appSiteUrl) {
var count=10;
var counter=setInterval(timer, 1000); // 1000 will run it every 1 second
var pTop;
var pLeft;
//var ss = data.getActiveSpreadsheet();
//var activeSheet = ss.getSheets()[2];
var oData = data;
var dataStructure = '';
/* Function: Popup Close */
$(document).on('click', '.modalpopupbackdrop,.modalpopup_title .close', function (e) {
e.preventDefault();
// Fade Out Modal Popup
$('.modalpopupbackdrop').delay(75).fadeOut(125);
$('.modalpopup').animate({ opacity: '0' }, 150, function () {
// Remove from DOM
var removePopupFrame = setTimeout(function () {
$('.modalpopupbackdrop,.modalpopup').remove();
}, 450);
});
});
/* Popup Structure */
var pStructure =
// Modal Backdrop
'<div class="modalpopupbackdrop" aria-hidden="true"></div>' +
// Modal Frame
'<div class="modalpopup ' + pClass + '" style="max-width: ' + maxWidth + 'px;" aria-label="Popup Notice for Selected Site">' +
'<div class="modalpopup_inner">' +
// Title
'<div class="modalpopup_title">' +
// Close Button
'<a href="javascript:void();" class="close" title="Click to Close Popup" aria-label="close"></a>' +
// Modal Title
'<h3>' + pTitle + '</h3>' +
'</div>' +
// Data Wrapper
'<div class="modalpopup_content"></div>' +
// Cookie and Timer
'<div class="modalpopup_cookieandtimer">' +
// Cookie
'<div class="modalpopup_cookie">' +
'<label>' +
'<input type="checkbox" value="" name="" /> ' +
'Don\'t show this screen in the future.' +
'</label>' +
'</div>' +
// Timer
'<div class="modalpopup_counter">' +
'Autoredirecting in <span class="timer"></span>' +
'</div>' +
'</div>' +
// Buttons
'<div class="modalpopup_buttonholder">' +
'<a href="#" class="button btn-cancel">Cancel</a>' +
'<a href="#" class="button btn-help">Help</a>' +
'<a href="#" class="button btn-comment">Submit a Comment</a>' +
'<a href="#" class="button btn-home">Home</a>' +
'</div>' +
'</div>' +
'</div>';
/* Append Popup to Body */
$('body').append(pStructure);
// Calculate Negative Top and Left Margin to Position Popup
pTop = -($('.modalpopup').height() / 2);
pLeft = -($('.modalpopup').width() / 2);
// Assign Top and Left Margin Values
$('.modalpopup').css({ marginTop: pTop, marginLeft: pLeft });
// Fade Popup In
$('.modalpopupbackdrop').fadeIn(125);
$('.modalpopup').delay(75).fadeIn(125);
// Counter Loop
function timer() {
count=count-1;
if (count <= 0){
clearInterval(counter);
return;
// Direct User to Selected Site:
//window.location.href = appSiteUrl;
}
$('.timer').html(count + ' seconds.');
}
timer();
// Append Fetched Data to Popup
setTimeout(function(){
console.log(oData);
dataStructure += '<h3>' + oData.feed.title.$t + '</h3>';
// Append Data Output
$('.modalpopup_content').append(dataStructure);
},300);
}
/**
* Globe Initialization Settings
* - pTitle:
* - appUrl:
* - appData:
* ************************************************************ */
global.egpInit = function (pTitle,appSiteUrl,appData) {
// Debug
console.log('Function egpInit Initialized');
// Variables
var dataUrl = 'https://spreadsheets.google.com/feeds/list/' + appData + '/od6/public/values?alt=json-in-script';
var errorMessage = 'An error occurred while initializing .egpInit.';
console.log(dataUrl);
$.ajax({
url: dataUrl,
method: 'POST',
dataType: 'jsonp',
beforeSend: function () { global.ajaxProcessingElems('before') },
complete: function () { global.ajaxProcessingElems('complete') },
success: function (data) {
//function goToSheet(sheetName) {
//var sheet = SpreadsheetApp.getActive().getSheetByName(sheetName);
//SpreadsheetApp.setActiveSheet(sheet);
//}
goToSheet("FG");
global.popupModalInit('content', 'fireglobe', '700', pTitle, data, appSiteUrl);
},
error: function () {
// Debug
console.log(errorMessage);
}
});
}
return global;
})();
我的 HTML 如下：
<ul>
<li>
<a href="javascript:appRedirect.egpInit('Popup 1','http://www.google.com/globe/','1YERueWgOB1TJ3HrtK4NnrnXCTDaZ5kmTS379Sozljbc');">
Information 1
</a>
</li>
<li>
<a href="javascript:appRedirect.egpInit('Popup 2','https://www.yahoo.com/sa/','1YERueWgOB1TJ3HrtK4NnrnXCTDaZ5kmTS379Sozljbc');">
Information 2
</a>
</li>
</ul>
我不确定如何在工作表之间切换。现在它可以是静态的，稍后我可以将它添加为我的函数的参数：global.egpInit(pTitle,appSiteUrl,appData)
非常感谢任何帮助。
【问题讨论】：
-
我在 SO 找到了一些链接，提供了一些内部链接：stackoverflow.com/questions/19942619/…stackoverflow.com/questions/24531351/… 和外部链接：damolab.blogspot.com/2011/03/… 不幸的是，关于这个主题的信息并不多。但是我找到的那些链接应该能够帮助其他人解决同样的问题。
标签： javascript jquery ajax google-sheets-api google-data-api