0
我把一個簡單的jQuery/JavaScript彈出框放在一起。使用AJAX，我想從可公開訪問的Google Spreadsheet中的單元格中填充彈出窗口的內容。我可以做到這一點，並且我已經成功地從json格式的Google Spreadsheet中獲取數據。如何使用JavaScript/jQuery更改Google Spreadsheet中的活動工作表？
問題是我需要訪問的內容是在不同的'表'中。我不太瞭解Google文檔，也不知道如何去「激活」不同的工作表。我想要激活的工作表的名稱是'FG'。另一個是'SA'。
我發現了一個像下面這樣的JS函數，並將其放入我的代碼中，但在閱讀更多內容後，似乎該函數應該被放入Google Spreadsheet中，並轉到spreadsheet > Tools > Script editor...。
function goToSheet(sheetName) {
var sheet = SpreadsheetApp.getActive().getSheetByName(sheetName);
SpreadsheetApp.setActiveSheet(sheet);
}
所以我把調用該函數與「表」我要加載的成功在我的JS AJAX調用內部的參數值的方式的名稱，功能不加載。
我的jQuery/JavaScript的在我的index.html文件如下：
/**
* 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)
任何幫助，非常感謝。
我發現這裏的一些鏈接在使提供了一些INSITE：http://stackoverflow.com/questions/19942619/query-specific-sheets-of-a-google -spreadsheet http://stackoverflow.com/questions/24531351/retrieve-google-spreadsheet-worksheet-json和外部鏈接：http://damolab.blogspot.com/2011/03/od6-a nd-finding-other-worksheet-ids.html不幸的是，關於這個問題沒有太多的信息。但是我發現的這些鏈接應該能夠幫助其他人解決相同的問題。 – Pegues