php進位制轉換
阿新 • • 發佈:2022-03-24
前端html頁面程式碼:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <scriptsrc="./jquery-3.6.0.js"></script> <script type="text/javascript"> function test(){ $.ajax({ url: "http://localhost:9001/test.php", type:'POST', data:"shi="+document.getElementById('shi').value+"&op="+document.getElementById('op').value, success:function (data){ console.log(data); document.getElementById('res').value = data; } }) } </script> </head> <body> <p>十進位制: <input type="text" id="shi"> 請輸入需要轉換的進位制: <select id="op"> <option value="1">二進位制</option> <option value="2">八進位制</option> <option value="3">十六進位制</option> </select> <input type="button" value="轉換" onclick="test()"></input> <input type="text" id="res"> </p> </body> </html>
我使用的是Apache伺服器,9001是我個人的埠號,ajax請求路徑可以自行修改成自己的。
注:
<script src="./jquery-3.6.0.js"></script>
這段程式碼我是在匯入Jquery的包,因為要使用Ajax就得導JQuery的檔案,我就不提供了,自己去下一個就行,網上很多方式。
php程式碼:
<?php $data = $_POST['shi']; $jin = $_POST['op']; if ($jin == 1){ echo decbin($data); } elseif ($jin == 2){ echo decoct($data); } elseif ($jin == 3){ echo dechex($data); } ?>
我是寫成了兩個檔案,一個test.html,一個test.php。html頁面去請求php然後接受計算結果,展現到前端文字框內,因為要在同一個頁面顯示所以用ajax。
使用分離的方式主要是php上課在看Python視訊了,不知道老師是怎麼演示的,所以不會,只能退而求其次用自己的辦法。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="./jquery-3.6.0.js"></script><script type="text/javascript"> function test(){ $.ajax({ url: "http://localhost:9001/test.php", type:'POST', data:"shi="+document.getElementById('shi').value+"&op="+document.getElementById('op').value, success:function (data){ console.log(data); document.getElementById('res').value = data; } }) } </script>
</head> <body> <p>十進位制: <input type="text" id="shi"> 請輸入需要轉換的進位制: <select id="op"> <option value="1">二進位制</option> <option value="2">八進位制</option> <option value="3">十六進位制</option> </select> <input type="button" value="轉換" onclick="test()"></input> <input type="text" id="res"> </p> </body> </html>