我是知識王 - 學生版 | Programming Project

{"id":95353,"student_id":10,"content":"{\"html\":\"\u003c!DOCTYPE html\u003e\\n\u003chtml\u003e\\n\u003chead\u003e\\n\\t\u003ctitle\u003eDocument\u003c/title\u003e\\n\\t\u003cscript src=\\\"https://code.jquery.com/jquery-3.4.1.min.js\\\"\u003e\u003c/script\u003e\\n\u003c/head\u003e\\n\u003cbody\u003e\\n    \u003ch1\u003e我是知識王\u003c/h1\u003e\\n    \\n    \u003c!-- 題目與選項 --\u003e\\n    \u003cdiv class=\\\"card\\\"\u003e\\n        \u003cp id=\\\"content\\\"\u003e點擊「開始」進行挑戰！\u003c/p\u003e\\n        \u003cbutton id=\\\"a\\\" class=\\\"option\\\" disabled=\\\"true\\\"\u003e？\u003c/button\u003e\\n        \u003cbutton id=\\\"b\\\" class=\\\"option\\\" disabled=\\\"true\\\"\u003e？\u003c/button\u003e\\n        \u003cbutton id=\\\"c\\\" class=\\\"option\\\" disabled=\\\"true\\\"\u003e？\u003c/button\u003e\\n        \u003cbutton id=\\\"d\\\" class=\\\"option\\\" disabled=\\\"true\\\"\u003e？\u003c/button\u003e\\n    \u003c/div\u003e\\n    \\n    \u003cdiv\u003e\\n        \u003cbutton id=\\\"start\\\"\u003e開始\u003c/button\u003e\\n        \u003cbutton id=\\\"next\\\"\u003e下一題\u003c/button\u003e\\n    \u003c/div\u003e\\n    \\n    \u003c!-- 分數結果 \u0026 排行榜 --\u003e\\n    \u003cdiv id=\\\"rank\\\" class=\\\"card\\\"\u003e\\n        \u003cp id=\\\"result\\\"\u003e排行榜\u003c/p\u003e\\n        \u003col id=\\\"list\\\"\u003e\u003c/ol\u003e\\n    \u003c/div\u003e\\n\u003c/body\u003e\\n\u003c/html\u003e\",\"css\":\"/* \\n * 為了降低 HTML 閱讀壓力盡量減少 class 命名數量\\n * 並直接針對元素名稱或 ID 來調整樣式\\n * 因專案當純命名也盡可能簡短\\n * 不針對 CSS 與 JS 用途去區分 class 命名\\n */\\nbody {\\n    background: #D7423C;\\n    padding: 50px;\\n    text-align: center;\\n}\\n\\nh1, #start, #next {\\n    color: #fff;\\n}\\n\\n#start, #next {\\n    background: none;\\n    border: none;\\n    text-decoration: underline;\\n    cursor: pointer;\\n}\\n\\n#rank, #next {\\n    display: none;\\n}\\n\\nbutton {\\n    font-size: 1rem;\\n}\\n\\n.card {\\n    max-width: 300px;\\n    padding: 30px;\\n    border-radius: 5px;\\n    margin: auto;\\n    margin-bottom: 20px;\\n    color: #5a9aa8;\\n    background-color: #fff;\\n    box-shadow: 0px 10px 0px rgba(0, 0, 0, 0.3);\\n}\\n\\n.option {\\n    padding: 10px;\\n    display: block;\\n    width: 100%;\\n    margin: 10px 0px;\\n    border: 1px solid #5a9aa8;\\n    border-radius: 5px;\\n    color: #5a9aa8;\\n    cursor: pointer;\\n}\\n\\n.red {\\n    color: #fff;\\n    border-color: #F60F4C;\\n    background-color: #F60F4C;\\n}\\n\\n.green {\\n    color: #fff;\\n    border-color: #00C46D;\\n    background-color: #00C46D;\\n}\",\"js\":\"var record = DB.table('record'); // 記錄玩家的分數\\nvar answer; // 記錄當前題目的正確答案\\nvar score = 0; // 記錄當前玩家獲得的分數\\n\\n$('#start').click(start); //「開始」按鈕被點擊時時執行 start\\n$('.option').click(answerQuestion); // 四個選項按鈕任何一個被點擊時執行 answerQuestion\\n$('#next').click(showQuestion); //「下一題」按鈕被點擊時執行 showQuestion\\n\\n\\n// 從題庫中隨機抽出 10 道題目並顯示第一題\\nfunction start () {\\n\\n}\\n\\n// 顯示題目\\nfunction showQuestion () {\\n\\n}\\n\\n// 判斷作答是否正確\\nfunction answerQuestion () {\\n\\n}\\n\\n// 遊戲結束\\nfunction gameover () {\\n\\n}\\n\\n// 顯示排行榜\\nfunction showRank (data) {\\n\\n}\\n\"}","created_at":"2019-09-15T11:21:15.885+08:00","updated_at":"2019-11-11T11:19:46.063+08:00","name":"我是知識王 - 學生版","language":"web","screenshot":{"url":"/uploads/project/screenshot/95353/28e839ae9ca0c7114e0481c4591e78fb.jpg"},"parent_id":3,"plugin":"var questions = [\n    {\n        content: '以下何者不是三原色？',\n        a: '紅',\n        b: '綠',\n        c: '藍',\n        d: '黃',\n        answer: 'd'\n    },\n    {\n        content: '5 + 4 = ？',\n        a: '9',\n        b: '10',\n        c: '11',\n        d: '12',\n        answer: 'a'\n    },\n    {\n        content: '9 + 9？',\n        a: '10',\n        b: '14',\n        c: '18',\n        d: '22',\n        answer: 'c'\n    },\n    {\n        content: '以下何者不是三原色？',\n        a: '紅',\n        b: '綠',\n        c: '藍',\n        d: '黃',\n        answer: 'd'\n    },\n    {\n        content: '5 + 4 = ？',\n        a: '9',\n        b: '10',\n        c: '11',\n        d: '12',\n        answer: 'a'\n    },\n    {\n        content: '9 + 9？',\n        a: '10',\n        b: '14',\n        c: '18',\n        d: '22',\n        answer: 'c'\n    },\n    {\n        content: '以下何者不是三原色？',\n        a: '紅',\n        b: '綠',\n        c: '藍',\n        d: '黃',\n        answer: 'd'\n    },\n    {\n        content: '5 + 4 = ？',\n        a: '9',\n        b: '10',\n        c: '11',\n        d: '12',\n        answer: 'a'\n    },\n    {\n        content: '9 + 9？',\n        a: '10',\n        b: '14',\n        c: '18',\n        d: '22',\n        answer: 'c'\n    },{\n        content: '以下何者不是三原色？',\n        a: '紅',\n        b: '綠',\n        c: '藍',\n        d: '黃',\n        answer: 'd'\n    },\n    {\n        content: '5 + 4 = ？',\n        a: '9',\n        b: '10',\n        c: '11',\n        d: '12',\n        answer: 'a'\n    },\n    {\n        content: '9 + 9？',\n        a: '10',\n        b: '14',\n        c: '18',\n        d: '22',\n        answer: 'c'\n    },\n]","description":null,"note":null,"status":"public","like_student_ids":[],"is_featured":false,"views":468,"hashid":"zpes4q82","is_content_changed":false,"review_status":"unsubmitted","submitted_at":null,"reviewed_at":null,"advise":null,"is_deleted":false}