表のセルをクリックしたらalertが出るようにしたい
Q&A
Closed
まるばつゲームを作成している途中です。
表のどれかのセルをクリックしたらalert("cellをクリックしました。")が表示されるようにしたいです。
エラーが起きてしまい、表すら表示されません。
どなたかご教授お願いいたします。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
#gameTable {
width: 100px;
height: 100px;
}
</style>
</head>
<body>
<h1>まるばつゲーム</h1>
<p>マークを選択してから、盤面をクリック！</p>
<input id="maru" type="button" value="〇" onclick=which(maru)>
<input id="batu" type="button" value="✕" onclick=which(batu)>
<br>
<br>
<div id="field">
</div>
<p id="inputWhich"></p>
<script>
let i, j;
let tbl = document.createElement("table");
tbl.border="1";
tbl.className="gameTable";
for(i=0;i<=2;i++){
let tr = document.createElement("tr");
for(j=0;j<=2;j++){
let td = document.createElement("td");
td.id="cell"+i+j;
td.height="50px";
td.width="50px";
td.onclick=inputMark();
tr.appendChild(td);
}
tbl.appendChild(tr);
}
document.getElementById("field").appendChild(tbl);
const which=(a)=>{
let tx;
if(a==maru){
tx = "〇";
}else if(a==batu){
tx = "✕";
}
document.getElementById("inputWhich").innerText = tx + "を入力します。";
}
const inputMark=()=>{
alert("cellをクリックしました。");
}
</script>
</body>
</html>
0 likes
