BMI 計算機副本 | 程式專案

{"id":68882,"student_id":1404,"content":"{\"html\":\"\u003chtml\u003e\\n\u003chead\u003e\\n    \u003ctitle\u003eDocument\u003c/title\u003e\\n    \u003cscript src=\\\"https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js\\\"\u003e\u003c/script\u003e\\n\u003c/head\u003e\\n\u003cbody\u003e\\n    \u003cimg src=\\\"guess.png\\\" id=\\\"img-guess\\\" /\u003e\\n    \u003cimg src=\\\"fat.png\\\" id=\\\"img-fat\\\" /\u003e\\n    \u003cimg src=\\\"normal.png\\\" id=\\\"img-normal\\\" /\u003e\\n    \u003cimg src=\\\"slim.png\\\" id=\\\"img-slim\\\" /\u003e\\n\\n    \u003ch1 id=\\\"result\\\"\u003eBMI 計算結果：\u003c/h1\u003e\\n\\n    \u003cinput type=\\\"number\\\" id=\\\"input1\\\" placeholder=\\\"身高(公分)\\\"\u003e\\n    \u003cinput type=\\\"number\\\" id=\\\"input2\\\" placeholder=\\\"體重(公斤)\\\"\u003e\\n    \u003cbutton id=\\\"btn-start\\\"\u003e計算！\u003c/button\u003e\\n\\n\u003c/body\u003e\\n\u003c/html\u003e\",\"css\":\"/* 實作練習 2 */\\nbody {\\n    text-align: center;\\n    padding: 60px;\\n}\\nimg {\\n    height: 200px;\\n    width: auto; /*預設也是 auto*/\\n}\\n\\n\\n/* 實作練習 4 */\\ninput {\\n    width: 50vw;\\n    font-size: 16px;\\n    padding: 10px;\\n    margin: 10px;\\n    border: 2px solid #ddd;\\n    border-radius: 5px;\\n}\\n\\nbutton {\\n    /*與上方 input 都一樣，但 border 須改設為 0*/\\n    width: 50vw;\\n    font-size: 16px;\\n    padding: 10px;\\n    margin: 10px;\\n    border: 0;\\n    border-radius: 5px;\\n    /*另外加上*/\\n    color: #fff;\\n    background-color: red;\\n}\\n\",\"js\":\"// 實作練習 5\\n// 透過 jQuery 效果，載入後 隱藏圖片。\\n$('#img-slim').hide();\\n$('#img-normal').hide();\\n$('#img-fat').hide();\\n\\n// 當按鈕被點擊，呼叫 getResult()\\n$('#btn-start').on('click', getResult);\\n\\nfunction getResult() {\\n\\n    // 實作練習 6\\n    var h = $('#input1').val();\\n    var w = $('#input2').val();\\n    // alert('h='+h+' w='+w); // 測試用\\n\\n    // 實作練習 7\\n    h = parseFloat(h)/100;\\n    w = parseFloat(w);\\n    var bmi = w / (h*h);\\n    bmi = bmi.toFixed(2);\\n    \\n    // 實作練習 8\\n    $('img').hide();\\n    var text;\\n    if (bmi \u003c= 18.5) {\\n        text = ' 太輕了！';\\n        $('#img-slim').show();\\n    } else if (18.5 \u003c bmi \u0026\u0026 bmi \u003c= 24.9) {\\n        text = ' 正常！';\\n        $('#img-normal').show();\\n    } else if (bmi \u003e 24.9) {\\n        text =' 過胖哦！';\\n        $('#img-fat').show();\\n    }\\n    \\n    $('#result').text(\\\"計算結果 BMI：\\\" + bmi + text);\\n\\n\\n}\\n\\n\\n\\n\"}","created_at":"2019-05-20T17:04:47.935+08:00","updated_at":"2019-10-17T19:40:45.370+08:00","name":"BMI 計算機 副本","language":"web","screenshot":{"url":"https://cdn8.koding.school/uploads/project/screenshot/68882/7bd0c1a96154314cfa2e8d124cc43170.jpg"},"parent_id":67776,"plugin":"","description":null,"note":null,"status":"public","like_student_ids":[],"is_featured":false,"views":67,"hashid":"jzmsndzk","is_content_changed":false,"review_status":"unsubmitted","submitted_at":null,"reviewed_at":null,"advise":null,"is_deleted":false}