ฉันมีแอปพลิเคชันขนาดใหญ่ที่ฉันต้องการแปลงจากแซนด์บ็อกซ์แบบ NATIVE เป็น IFRAME เนื่องจาก NATIVE เลิกใช้งานแล้ว ขั้นตอนทั่วไปของแอปพลิเคชันมีดังนี้: ผู้ใช้กรอกแบบฟอร์มในหน้าเริ่มต้นและกดปุ่มเริ่มต้น จากนั้นเพจเริ่มต้นจะถูกซ่อน และขึ้นอยู่กับค่าจากหน้าแรก จากนั้นผู้ใช้จะเห็นเพจใหม่ ปัญหาของฉันเมื่อใช้ IFRAME คือหน้าใหม่ไม่แสดงเลย มันทำงานตามที่คาดไว้ในโหมด NATIVE ฉันได้สร้างสคริปต์แบบง่ายที่แสดงปัญหาแล้ว โปรดช่วยฉันเข้าใจว่าฉันลืมหรือทำอะไรผิด
Code.gs
function doGet() {
Logger.log('enter doget');
var html = HtmlService.createTemplateFromFile('BeginHeader').evaluate()
.setSandboxMode(HtmlService.SandboxMode.IFRAME);
return html;
}
function include(filename) {
Logger.log('enter include');
Logger.log(filename);
var html = HtmlService.createHtmlOutputFromFile(filename).getContent();
Logger.log(html);
return html;
}
จาวาสคริปต์.html
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script
src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js">
</script>
<script
src="https://apis.google.com/js/api.js?onload=onApiLoad">
</script>
<script>
function showForm(hdr) {
console.log('enter showform');
console.log(hdr);
console.log('hiding first page');
document.getElementById('beginDiv').style.display = 'none';
var el = document.getElementById('recordDiv');
el.innerHTML = hdr;
console.log('showing new page');
el.style.display = 'block';
}
function oops(error) {
console.log('entered oops');
alert(error.message);
}
</script>
<script>
$(document).ready(function() {
console.log('begin ready');
$("#beginForm").submit(function() {
console.log('enter begin submit');
//console.log('hiding first page');
//document.getElementById('beginDiv').style.display = 'none';
console.log('including page 2');
google.script.run
.withSuccessHandler(showForm)
.withFailureHandler(oops)
.include('Page2');
});
});
</script>
BeginHeader.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<div id="beginDiv" style="display:block">
<p>Click on Begin. </p>
<form id="beginForm">
<input type="submit" value="Begin">
</form>
</div>
<!-- results of content being filled in -->
<div id="recordDiv"></div>
<?!= include('Javascript'); ?>
</body>
</html>
หน้า2.html
<!DOCTYPE html>
<html>
<body>
<p> This is page 2. </p>
</body>
</html>