right triangle calculator

右三角 - 在線區域計算器

給定三個維度 - 2腿的長度和斜邊的長度分別計算出區域。
如果無法形成正確的三角形，請警報。

內容

1. 嘗試一下
2. 它如何工作
3. 外部參考

---

嘗試一下

該網站由5個文件組成：index.html，result.php，style.css，resultsheet.css和script.js。
在這裡下載。
在您的根目錄下，創建一個文件夾。將其命名為“正確的三角形”。將這些文件保存在該文件夾中。
然後，啟動虛擬服務器。在您的網絡瀏覽器上，輸入此地址：localhost/右三角/index.html
（假設您在Windows上使用XAMPP）
您現在在輸入頁面上。
在輸入頁面上，您將看到標題“正確的三角形！”在頂部，三個圓圈，一個提交按鈕，
和頁面底部的藍色三角形。這3個圓圈實際上是輸入字段。
嘗試做以下操作：

• 將鼠標光標懸停在其中一個圓圈上
• 將鼠標光標懸停在提交按鈕上
• 將鼠標光標懸停在三角形附近
• 將一個或全部的字段留為空，然後按下提交按鈕
• 沒有空白的字段，而是將字母字符輸入其中一個字段，然後點擊提交

完成此操作後，嘗試將數字輸入到這3個圓圈並點擊提交按鈕。
它們分別是腿，腿和斜邊的長度。
它應該將您重定向到結果頁面。如果您分別輸入3、4和5，則應該得到
諸如“區域：6”之類的東西。如果您輸入10、9和4，則應該得到“給定維度”之類的東西
對於正確的三角形不合適。”

---

它如何工作

當您將鼠標光標懸停在三角形附近時，三角形旋轉並向上移動，其顏色變為紅色。
這是通過其在帶有偽類的CSS選擇器中進行的樣式來完成的。

 #triangle：懸停{
    邊界：實心65px;
    邊界色：透明透明＃f12f2f透明；
    保證金頂：0px;
    變換：旋轉（180DEG）scalex（-1）;
}

請注意最後一行transform: rotate(180deg) scaleX(-1);這使三角形在懸停在懸停上旋轉。
接下來，檢查腳本。其中有2個if語句，該語句告訴輸入是否無效。
它通過將某些內容與null進行比較來檢查用戶是否輸入了某些內容。回想一下null是數據類型
這基本上意味著“無”。
我們還具有isNan函數來檢查輸入是否為數字。 Nan代表N umber 。
如果輸入有效的輸入，則該語句中的代碼不會執行。然後JavaScript創建3個cookie
分別使用名稱a，b，c，將您之前提交的輸入存儲。然後它將您重定向到
結果頁面，這是結果。php
在結果頁面上，PHP進行數學。首先，它調用javaScript前面創建的cookie值，
並將這些值存儲在三個變量中，即$a ， $b ， $c 。
然後，它使用畢達哥拉斯定理檢查這些值（三角形的尺寸）是否可以構成一個
右三角。如果可以的話，結果頁面將顯示文本“區域：”與三角形的區域一起顯示。
如果不能，結果頁面將顯示“給定的維度不適合正確的三角形”的文本。

---

外部參考

1. 虛擬服務器
2. 用JavaScript處理餅乾
3. PHP的$ _cookie
4. 畢達哥拉斯的定理