<!DOCTYPE html>
<html lang="ja">
<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>受信HTML</title>
<script>
window.onload = function() {
// URLを取得
const url = new URL(window.location.href);
// URLSearchParamsオブジェクトを取得
const params = url.searchParams;
// パラメータから「username」を取得
let m = params.get("m");
let s = params.get("s");
if(m == ''){
m = '0';
}
if(s == ''){
s = '0';
}
// IDを使ってspan要素を取得する
const span1 = document.getElementById("receivedName1");
const span2 = document.getElementById("receivedName2");
// 取得したspan要素に受け取ったパラメータを代入
span1.innerText = m;
span2.innerText = s;
const x = document.querySelector("#test1");
x.addEventListener("click",func1);
function func1() {
let x = document.form1.kai.value;
const z =document.querySelector("#test2");
z.textContent = '1分あたり' + (parseInt(x)/(60*parseInt(m)+parseInt(s))*60).toFixed(1) + '回です';
}
}
</script>
</head>
<body>
<form name="form1" align = "center" >
<h2>あなたの記録は<p> <span id="receivedName1" align = "center"></span>分
<span id="receivedName2" align = "center"></span>秒で
<input type="number" name="kai" align = "center" size = 5 >回です。</h2>
<h2> </h2>
<div>
<input type = "button" id ="test1" style="wedth:60%;padding:10px;font-size:30px;" value="1分当たりの回数" align = "center">
</div>
</form>
<h2 type = "number" id="test2" style="text-align:center"></h2>
</body>
</html>
