我正在從我的工作計算機上運行一個簡單的網頁。絕大多數網站在我的工作計算機上被阻止,所以我希望能夠使用HTML + CSS + Javascript的簡單組合完成此任務。如何在HTML中創建表格網頁的簡單表單?
這個想法是,用戶爲他感興趣的考試選擇多個複選框,然後他點擊「生成工作表」按鈕,該工具欄將打開一個單獨的選項卡,該選項卡僅顯示所選考試的休息時間表。
我已經開始研究代碼的基礎知識,但是我不斷收到一些使我無法繼續前進的錯誤。
谷歌Chrome瀏覽器的控制檯調試器給了我以下錯誤:
- 未捕獲的SyntaxError:無效的或意外的標記(forAcey.html:59)
- 未捕獲的ReferenceError:檢查在HTMLButtonElement.onclick沒有定義 ( forAcey.html:33)
單擊「生成工作表」按鈕時顯示第二個錯誤。
你能幫我們弄清楚我的錯誤在哪裏以及如何糾正它們?
此外,您是否有任何改進我的代碼的提示?
我附上了我的代碼片段。
<html>
<head>
\t <title>Break Schedules</title>
\t
\t <!-- Style -->
\t <link rel="stylesheet" href="forAcey.css"/> \t
\t
\t <!-- Scripts -->
\t <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> \t
</head>
<body>
\t <h2>Break Schedules</h2>
\t <!-- Form -->
\t <div>
\t \t <form id="DateForm">
\t \t \t <b>Date:</b>
\t \t \t <input id=DateID type="Date" name="myDate"><br>
\t \t </form>
\t \t
\t \t <h4>Check off the exams you need.</h4>
\t \t
\t \t <div>
\t \t \t <form id="CheckForm">
\t \t \t \t <input type = "checkbox" id="exam1" name="exam1" value="exam1">exam1<br>
\t \t \t \t <input type = "checkbox" id="exam2" name="exam2" value="exam2">exam2<br>
\t \t \t \t <input type = "checkbox" id="exam3" name="exam3" value="exam3">exam3<br>
\t \t \t </form> \t
\t \t </div>
\t \t
\t \t <button onclick="Checks()">Generate Sheet</button><br> <br>
\t \t <button onclick="location.reload()">Reset Form</button>
\t </div>
\t
\t <script>
\t \t $(document).keydown(function(e){
\t \t \t if (e.keyCode == 13) {
\t \t \t \t Checks();
\t \t \t return false;
\t \t \t }
\t \t });
\t \t
\t \t function Checks(){ \t \t \t
\t \t <!-- Date -->
\t \t var x = document.getElementById("DateForm");
\t \t var The_Date = "";
\t \t var i;
\t \t for (i = 0; i < x.length ;i++) {
\t \t \t The_Date += x.elements[i].value + "<br>";
\t \t }
\t }
\t var checkexam1=document.getElementById("exam1").checked;
\t var checkexam2=document.getElementById("exam2").checked;
\t var checkexam3=document.getElementById("exam3").checked;
\t
\t final_string="<html><h2>"+The_Date+"</h2>
\t
\t if (exam1==true){
final_string+="<tr><td>exam1</td><td>this is the break schedule for exam1</td></tr>";
}
\t if (exam2==true){
final_string+="<tr><td>STEP 1-2-3</td><td>this is the break schedule for exam2</td></tr>";
}
\t if (exam3==true){
final_string+="<tr><td>PMI</td><td>this is the break schedule for exam3</td></tr>";
}
\t
\t final_string+="</table></html>"
var new_page=window.open('','name');
new_page.document.write(final_string);
new_page.document.close();
\t
\t </script
</body>
</html>
很快,我看到你有多行字符串,這是不允許在JavaScript(事實上,它是允許的,但你必須使用反向和IE瀏覽器的兼容性問題)。 –
我該如何使用反引號來編寫該代碼? – Acey
«'... ...'»檢查此鏈接https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Template_literals –