首頁 >web前端 >css教學 >我可以開車嗎?編寫酒精測試儀程式碼

我可以開車嗎?編寫酒精測試儀程式碼

Mary-Kate Olsen
Mary-Kate Olsen原創
2024-11-10 21:01:03994瀏覽

在我居住的丹麥,不幸的是,我們在歐洲保持著一項記錄:我們的孩子是歐洲大陸飲酒最多的人。正因為如此,人們非常關注減少青少年飲酒量並教育孩子們了解酒精的影響。

我為當地學校編寫了一個 HTML 和 JavaScript 酒精計算器,向學生展示酒精如何影響身體以及如何計算血液酒精含量 (BAC)。

BAC是如何計算的?

要估算 BAC 或“promille”,您需要一些關鍵資訊:

  • 您的體重 – 因為較大的身體比較小的身體更能稀釋酒精。
  • 生物性別 – 由於體內水分含量不同,進而影響酒精在體內的分佈。
  • 消耗的酒精單位數 – 因為每種飲料都有不同的酒精濃度。

計算酒精單位

不同的飲料會為您的血液貢獻不同量的酒精,這取決於其體積和酒精濃度。為了標準化,酒精的單位計算通常如下:

volume (cl) * alcohol percentage * 0.8 / 120

結構

整個「應用程式」的結構是一個

;具有有組織的字段集和命名控件,可以輕鬆地使用以下方式提取必要的元素:
const { add, addbeverage, etc. } = app.elements;

由於BAC限制因地區而異,我們需要先選擇地區,調整體重滑塊,並選擇生物性別:

Can I Drive? Coding an Alcohol Tester


接下來,我們可以開始加入飲料了:

Can I Drive? Coding an Alcohol Tester

這是一個簡單的

,其中單位、體積和酒精百分比的各個字段均被禁用(並通過 CSS 隱藏),直到您從飲料選擇器中進行選擇:

Can I Drive? Coding an Alcohol Tester

這些欄位的可見性由enableElements函數控制:

[percentage, units, volume].forEach(el => el.disabled = !bool);

當我們加入飲料時,會建立一份消耗飲料列表,並計算 BAC、預計醒酒時間等:

Can I Drive? Coding an Alcohol Tester

然後您可以繼續添加更多飲料,BAC 也會相應更新:

Can I Drive? Coding an Alcohol Tester

令我非常很驚訝的是,美國的合法BAC是瑞典或挪威的四倍!

換句話說,在瑞典,您可能吊銷執照,因為飲酒量達到了美國法律允許的量


分解 BAC 計算

BAC的核心計算在calculateAnswer函數中處理:

volume (cl) * alcohol percentage * 0.8 / 120

讓我們來分解一下:

  1. 酒精代謝率:alcoholMetabolismRate = 0.015

    • 數值代表身體每小時減少 BAC 的平均速率(約 0.015%)。
  2. 計算目前 BAC: currentBAC = ((total * 10) / ((weight.valueAsNumber * 1000) * parseFloat(bodywater.value))) * 100

    * parseFloat(bodywater.value))) * 100
      * parseFloat(bodywater.value))) * 100
    • *
    • 總計 * 10
    • :這會將消耗的總酒精單位轉換為克(因為 1 個單位約等於 10 克純酒精)。
    • weight.valueAsNumber * 1000
    • :將體重從公斤轉換為克以供計算。
    • bodywater.value
    • :基於生物性別的小數因子,影響酒精在體內的分佈(例如,男性為 0.58,女性為 0.49)。
    然後將結果乘以 100,將 BAC 轉換為百分比。
  3. 估計清醒時間
      :hoursToSober = (currentBAC / alcoholMetabolismRate).toFixed(1);
    將目前 BAC 除以新陳代謝率即可估算 BAC 達到零所需的時間。
  4. 判斷合法駕駛狀態
      : canDrive = currentBAC
  5. 將目前 BAC 與選定的法定 BAC 限值進行比較。如果當前BAC在限制範圍內,則認為使用者「適合駕駛」;否則,他們就不是。


calculateAnswer 函數然後將這些值組合成一條訊息,顯示當前的 BAC、清醒前的小時數以及使用者是否適合駕駛。


…本教學就到此結束。如果您願意,可以隨意嘗試 CodePen——也許可以創建一個對兒童更友善的用戶體驗。請記住,該工具提供了估計值,但沒有考慮您飲用每種飲料的時間等因素。請記住,它很可能會被清醒的人使用!

示範


封面由DALL·E,提示:

以類似於早期迪士尼和茶杯頭的卡通風格生成一輛醉車,作為圖像我可以裁剪到1000x420px。

以上是我可以開車嗎?編寫酒精測試儀程式碼的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn