0
我嘗試創建基本表單時遇到了問題。點擊添加其他文件?後,會出現一個預期的複製框,但提交順序按鈕會被推出屏幕,我似乎無法恢復。有沒有辦法解決這個問題?我工作的谷歌Apps腳本這裏是代碼:如何停止按鈕從屏幕上消失?
Code.gs
function doGet(e) {
return HtmlService.createHtmlOutputFromFile('HTML')
}
中將Html.HTML
<body>
<style type="text/css">
* {
margin: 0
}
.container {
width: 1250px
}
.header {
display: block;
background-color: #8000FF;
margin:auto;
width: 50%;
border:3px solid #41087B;
padding: 10px;
}
.header img {
float:left;
padding: 5px;
}
.header h1 {
color: white;
line-height: 80px;
text-align:center
}
.label {
float: left;
padding: 5px;
color: red;
}
.label-container {
width: 570px;
margin: 0 auto;
text-align:center;
margin: auto
}
.label p {
padding: 2px;
}
.inputBox {
float:left;
text-align: center;
}
.inputBox p {
text-align: center;
padding: 1px
}
.label2 {
float:left;
padding:5px;
color: red
}
.label2 p {
padding:2px
}
.inputBox2 {
float:left;
}
.inputBox2 p {
padding: 1px
}
.contentBackground {
background-color:#D8D8D8;
clear:left;
width: 60%;
margin: auto;
height: 200px
display: block;
}
.uploadFile p {
text-align: center;
padding: 20px;
color:red
}
.content p {
text-align: center;
color:red;
padding: 7px
}
.dropDown p {
text-align: center;
padding: 40px;
margin-left: 8px;
height:
}
.moreFiles {
text-align:center
}
.textBox {
text-align: center
}
.textBox p {
text-align:center;
padding: 5px
}
input.uploadButton {
position: fixed;
bottom: 170px;
left: 582px
}
</style>
<div class="container">
<form id="myForm">
<div class="header">
<h1>Order Form</h1>
</div>
<div class="label-container">
<div class="label">
<br>
<p><b>Customer Name</b></p>
<p><b>Due Date</b></p>
<p><b>Phone #</b></p>
</div>
<div class="inputBox">
<br>
<p><input type="text" name="myName"></p>
<p><input type="text"></p>
<p><input type="text"></p><br>
</div>
<div class="label2">
<br>
<p><b>Contact</b></p>
<p><b>E-mail</b></p>
<p><b>PO#</b></p>
</div>
<div class="inputBox2">
<br>
<p><input type="text"></p>
<p><input type="text"></p>
<p><input type="text"></p><br>
</div>
</div>
<div class="contentBackground">
<div class="uploadWrapper">
<div class="fileUpload">
<div class="uploadFile">
<p>Upload File: <span style="color:black"><input type="file" name="myFile" /></span></p>
</div>
<div class="content">
<p>Width(Inch) <input type="text" style="width: 100px"> Height(Inch) <input type="text" style="width: 100px"> Quantity <input type="text" style="width: 100px"></p>
</div>
</div>
</div>
<div class="dropDown">
<p>Material <select style="max-width: 10%;">
<option value="Paper">Paper</option>
<option value="Vinyl Banner">Vinyl Banner</option>
<option value="Adhesive Vinyl">Adhesive Vinyl</option>
<option value="Polygloss">Polygloss</option>
<option value="Translucent Vinyl">Translucent Vinyl</option>
<option value="Static Cling Clear">Static Cling Clear</option>
<option value="Static Cling White">Static Cling White</option>
<option value="Reverse Static Cling">Reverse Static Cling</option>
<option value="Outdoor Paper">Outdoor Paper</option>
<option value="Backlit Film">Backlit Film</option>
<option value="Foam">Foam</option>
<option value="Coroplast">Coroplast</option>
<option value="Corrugated Board">Corrugated Board</option>
<option value="Sintra">Sintra</option>
<option value="Canvas">Canvas</option>
<option value="Fabric">Fabric</option>
<option value="All Cling">All Cling</option>
</select>
Lamination <select>
<option value="None">None</option>
<option value="Matte">Matte</option>
<option value="Gloss">Gloss</option>
<option value="Lexan">Lexan</option>
<option value="Erasable">Erasable</option>
</select>
Mounting <select>
<option value="3/16" Foam">3/16" Foam</option>
<option value="3/16" Gator">3/16" Gator</option>
<option value="1/8" Sintra">1/8" Sintra</option>
<option value="24point Card">24point Card</option>
<option value="50point Card">50point Card</option>
<option value="Adhesive Back">Adhesive Back</option>
<option value="MDF">MDF</option>
<option value="Coroplast">Coroplast</option>
<option value="Masonite">Masonite</option>
<option value="020 Styrene">020 Styrene</option>
<option value="040 Styrene">040 Styrene</option>
<option value="060 Styrene">060 Styrene</option>
<option value="080 Styrene">080 Styrene</option>
<option value="Corrugated Board">Corrugated Board</option>
</select>
Ink <select>
<option value="Indoor">Indoor</option>
<option value="Outdoor">Outdoor</option>
</select></p>
</div>
</div>
<div class="moreFiles">
<a href="#" id="add">Add another file?</a>
</div>
<div class="textBox">
<p><label>Remark?</label></p>
<textarea></textarea>
</div>
<input type="submit" value="Submit Order" class="uploadButton"
onclick="this.value='Uploading..';
google.script.run.withSuccessHandler(fileUploaded)
.uploadFiles(this.parentNode);
return false;">
</form>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$("#add").on("click", function() {
var $last = $(".contentBackground").last();
$last.clone().insertAfter($last);
});
正如你所看到的提交順序按鈕消失,我不能進一步向下滾動。有沒有辦法來解決這個問題?
的jsfiddle鏈接:https://jsfiddle.net/hLzkpoxt/