{"id":576125,"student_id":2589,"content":"{\"html\":\"\u003c!DOCTYPE html\u003e\\n\u003chtml\u003e\\n\u003chead\u003e\\n \u003ctitle\u003eDocument\u003c/title\u003e\\n \u003cscript src=\\\"https://code.jquery.com/jquery-3.4.1.min.js\\\"\u003e\u003c/script\u003e\\n\u003c/head\u003e\\n\u003cbody\u003e\\n \u003cimg src=\\\"teacher.png\\\" /\u003e\\n \u003ctable\u003e\\n \u003cthead\u003e\\n \u003ctr\u003e\\n \u003cth\u003e姓名\u003c/th\u003e\\n \u003cth id=\\\"orderByCh\\\"\u003e國文\u003c/th\u003e\\n \u003cth id=\\\"orderByEn\\\"\u003e英文\u003c/th\u003e\\n \u003cth id=\\\"orderByMath\\\"\u003e數學\u003c/th\u003e\\n \u003cth id=\\\"orderBySum\\\"\u003e總成績\u003c/th\u003e\\n \u003cth\u003e\u003c/th\u003e\\n \u003c/tr\u003e\\n \u003c/thead\u003e\\n \u003ctbody\u003e\\n \u003ctr\u003e\\n \u003ctd\u003e束凱文\u003c/td\u003e\\n \u003ctd\u003e46\u003c/td\u003e\\n \u003ctd\u003e88\u003c/td\u003e\\n \u003ctd\u003e91\u003c/td\u003e\\n \u003ctd\u003e225\u003c/td\u003e\\n \u003ctd class=\\\"delete\\\" data-id=\\\"1\\\"\u003e刪除\u003c/td\u003e\\n \u003c/tr\u003e\\n \u003ctr\u003e\\n \u003ctd\u003e劉大偉\u003c/td\u003e\\n \u003ctd\u003e95\u003c/td\u003e\\n \u003ctd\u003e99\u003c/td\u003e\\n \u003ctd\u003e85\u003c/td\u003e\\n \u003ctd\u003e279\u003c/td\u003e\\n \u003ctd class=\\\"delete\\\" data-id=\\\"2\\\"\u003e刪除\u003c/td\u003e\\n \u003c/tr\u003e\\n \u003ctr\u003e\\n \u003ctd\u003e何小妹\u003c/td\u003e\\n \u003ctd\u003e75\u003c/td\u003e\\n \u003ctd\u003e100\u003c/td\u003e\\n \u003ctd\u003e68\u003c/td\u003e\\n \u003ctd\u003e243\u003c/td\u003e\\n \u003ctd class=\\\"delete\\\" data-id=\\\"3\\\"\u003e刪除\u003c/td\u003e\\n \u003c/tr\u003e\\n \u003ctr\u003e\\n \u003ctd\u003e邱小玉\u003c/td\u003e\\n \u003ctd\u003e97\u003c/td\u003e\\n \u003ctd\u003e81\u003c/td\u003e\\n \u003ctd\u003e35\u003c/td\u003e\\n \u003ctd\u003e213\u003c/td\u003e\\n \u003ctd class=\\\"delete\\\" data-id=\\\"4\\\"\u003e刪除\u003c/td\u003e\\n \u003c/tr\u003e\\n \u003c/tbody\u003e\\n \u003c/table\u003e\\n \u003cbutton id=\\\"create\\\"\u003e新增成績\u003c/button\u003e\\n\u003c/body\u003e\\n\u003c/html\u003e\",\"css\":\"body {\\n padding: 30px;\\n background-color: #eee;\\n text-align: center;\\n}\\n\\nimg {\\n max-width: 150px;\\n}\\n\\ntable {\\n border-collapse: collapse;\\n width: 100%;\\n margin: 15px 0px;\\n border: 1px solid #eee;\\n background-color: #fff;\\n}\\n\\nth, td {\\n padding: 15px;\\n border-bottom: 1px solid #ddd;\\n color: #333;\\n}\\n\\ntr td:last-child {\\n color: red;\\n cursor: pointer;\\n}\\n\\nbutton {\\n padding: 10px 20px; \\n border-radius: 5px; \\n border: none;\\n font-size: 1rem;\\n color: #fff;\\n background-color: #4CAF50;\\n cursor: pointer;\\n transition: 0.2s; \\n}\\n\\nbutton:hover {\\n color: #fff;\\n background-color: #4CAF50;\\n box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; \\n}\\n\\n#orderByCh,\\n#orderByEn,\\n#orderByMath,\\n#orderBySum {\\n cursor: pointer;\\n}\\n\\n#orderByCh:hover,\\n#orderByEn:hover,\\n#orderByMath:hover,\\n#orderBySum:hover {\\n color: orange;\\n}\\n\\n\\n\",\"js\":\"\"}","created_at":"2023-07-28T09:39:27.120+08:00","updated_at":"2023-07-28T09:39:31.413+08:00","name":"【綜合練習】老師小幫手:實作 1 - 解答","language":"web","screenshot":{"url":null},"parent_id":576123,"plugin":"var score = DB.table('score');\n\nvar toggleCn = -1; //國文排序方式\nvar toggleEn = -1; //英文排序方式\nvar toggleMath = -1; //數學排序方式\nvar toggleSum = -1; //總分排序方式\n\n$('#create').click(createScore); //點擊「新增成績」時執行 createScore 指令\n$('tbody').on('click', '.delete', deleteScore); //點擊「刪除」時執行 deleteScore 指令\n\n$('#orderByCh').click(orderByCh); //點擊「國文」標題時執行 orderByCh 指令\n$('#orderByEn').click(orderByEn); //點擊「英文」標題時執行 orderByCh 指令\n$('#orderByMath').click(orderByMath); //點擊「數學」標題時執行 orderByCh 指令\n$('#orderBySum').click(orderBySum); //點擊「總分」標題時執行 orderByCh 指令\n\n\nscore.read({}, renderTable);\n\n// 新增一位學生的成績資料\nfunction createScore() {\n var name = prompt('姓名?');\n var ch = Number(prompt('國文成績?'));\n var en = Number(prompt('英文成績?'));\n var math = Number(prompt('數學成績?'));\n var sum = ch + en + math;\n \n score.create({\n name: name,\n ch: ch,\n en: en,\n math: math,\n sum: sum\n });\n\n score.read({}, renderTable);\n}\n\n// 將資料庫查詢的資料 data 從新寫入畫面表格\nfunction renderTable(data) {\n $('tbody').empty();\n\n data.forEach(function (d) {\n var row = `\n \u003ctr\u003e\n \u003ctd\u003e${d.name}\u003c/td\u003e\n \u003ctd\u003e${d.ch}\u003c/td\u003e\n \u003ctd\u003e${d.en}\u003c/td\u003e\n \u003ctd\u003e${d.math}\u003c/td\u003e\n \u003ctd\u003e${d.sum}\u003c/td\u003e\n \u003ctd data-id=\"${d.id}\" class=\"delete\"\u003e刪除\u003c/td\u003e\n \u003c/tr\u003e\n `\n $('tbody').append(row);\n });\n}\n\n// 移除一筆學生成績資料\nfunction deleteScore () {\n var id = $(this).data('id');\n score.delete({\n id: id\n });\n score.read({}, renderTable);\n}\n\n// 根據國語成績進行排序\nfunction orderByCh() {\n score.read({}, {\n $orderBy: {\n ch: toggleCn,\n }\n }, renderTable);\n toggleCn *= -1;\n}\n\n// 根據英文成績進行排序\nfunction orderByEn() {\n score.read({}, {\n $orderBy: {\n en: toggleEn,\n }\n }, renderTable);\n toggleEn *= -1;\n}\n\n// 根據數學成績進行排序\nfunction orderByMath() {\n score.read({}, {\n $orderBy: {\n math: toggleMath,\n }\n }, renderTable);\n toggleMath *= -1;\n}\n\n// 根據總成績進行排序\nfunction orderBySum() {\n score.read({}, {\n $orderBy: {\n sum: toggleSum,\n }\n }, renderTable);\n toggleSum *= -1;\n}\n","description":null,"note":null,"status":"public","like_student_ids":[],"is_featured":false,"views":30,"hashid":"jzmskqzwp","is_content_changed":false,"review_status":"unsubmitted","submitted_at":null,"reviewed_at":null,"advise":null,"is_deleted":false}
[{"id":13054392,"file_name":"teacher.png","project_id":576125,"asset_id":663831,"created_at":"2023-07-28T09:39:31.411+08:00","updated_at":"2023-07-28T09:39:31.411+08:00"}]
橘蘋學習平台
橘蘋學習平台
我的作品
檢視專案頁
匯出
複製
匯入
刪除
下載 Android APP (APK)
截圖
前往網站頁面
1:1:1
1:1
full
用手機掃描下方 QRCode 進行安裝
或您也可以
下載 APK
到這台電腦
用手機掃描下方 QRCode 進行安裝
或您也可以
下載 APK
到這台電腦