我目前正在尝试从另一个文件中提取一个函数,当我单击一个按钮时,该函数可用于对HTML进行更改(这将提供向您自己的Google日历添加事件信息的选项)。在我之前编写代码的人员使用Django的压缩程序来处理其他文件,而我试图弄清楚如何使用以下代码来调用函数。代码如下:
{% compress js file event-add %}
<script src="{% static 'js/event/add.js' %}"></script>
{% endcompress %}
<script async defer src="https://apis.google.com/js/api.js"
onload="this.onload=function(){};handleClientLoad()"
onreadystatechange="if (this.readyState === 'complete')
this.onload()">
</script>
当我尝试时,我在控制台中收到错误
Uncaught ReferenceError: handleClientLoad is not defined
at HTMLScriptElement.onload
具体来说,我的handleClientLoad
函数位于我的add.js文件中,必须与Google日历API的脚本一起使用,但是我一直在努力使该函数失效。
add.js文件设置如下(简称为仅显示我需要的功能):
const AddEventForm = {
googleCalendar: () => {
const CLIENT_ID = 'my client id here';
const API_KEY = 'my api key here';
const SCOPES = "https://www.googleapis.com/auth/calendar.readonly";
const googleButton = document.getElementById('btn-gcalendar');
function handleClientLoad() {
gapi.load('client:auth2', initClient);
}
function initClient() {
gapi.client.init({
apiKey: API_KEY,
clientId: CLIENT_ID,
scope: SCOPES
}).then(function () {
// Listen for sign-in state changes.
gapi.auth2.getAuthInstance().isSignedIn.listen(updateSigninStatus);
// Handle the initial sign-in state.
updateSigninStatus(gapi.auth2.getAuthInstance().isSignedIn.get());
googleButton.onclick = handleAuthClick;
}, function(error) {
appendPre(JSON.stringify(error, null, 2));
});
}
function updateSigninStatus(isSignedIn) {
if (isSignedIn) {
googleButton.style.display = 'block';
} else {
googleButton.style.display = 'block';
}
}
function handleAuthClick(event) {
gapi.auth2.getAuthInstance().signIn();
}
function appendPre(message) {
const pre = document.getElementById('main-content');
const textContent = document.createTextNode(message + '\n');
pre.appendChild(textContent);
}
function listUpcomingEvents() {
gapi.client.calendar.events.list({
'calendarId': 'primary',
'timeMin': (new Date()).toISOString(),
'showDeleted': false,
'singleEvents': true,
'maxResults': 10,
'orderBy': 'startTime'
}).then(function(response) {
let events = response.result.items;
appendPre('Upcoming events:');
if (events.length > 0) {
for (i = 0; i < events.length; i++) {
let event = events[i];
let when = event.start.dateTime;
if (!when) {
when = event.start.date;
}
appendPre(event.summary + ' (' + when + ')')
}
} else {
appendPre('No upcoming events found.');
}
});
}
}
}