JSFiddle - React, Tailwind, and code Playground
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<script>
window.onload = function () {
document.getElementById('result_btn').onclick = function () {
let checkboxes = document.querySelectorAll('input[name=RQ_ck01]')
for (let checkbox of checkboxes) {
let label = document.querySelector(`label[for=${checkbox.id}]`).innerHTML
console.log(label, checkbox.value, checkbox.checked)
}
};
};
</script>
<body>
<div>
<input name="RQ_ck01" id="RQ_ck01_01" type="checkbox" value="1" />
<label for="RQ_ck01_01">方塊1</label>
</div>
<div>
<input name="RQ_ck01" id="RQ_ck01_02" type="checkbox" value="2" />
<label for="RQ_ck01_02">方塊2</label>
</div>
<div>
<input name="RQ_ck01" id="RQ_ck01_03" type="checkbox" value="3" />
<label for="RQ_ck01_03">方塊3</label>
</div>
<div>
<input name="RQ_ck01" id="RQ_ck01_04" type="checkbox" value="4" />
<label for="RQ_ck01_04">方塊4</label>
</div>
<button id="result_btn">確認結果</button>
</body>
</html>