ใช้ลิงค์เพื่อเลือก checkbox
หลักการก็คือใช้ tag a เมื่อทำการคลิกลิงค์ ให้ไปเรียก Javascript เพื่อทำการเลือก checkbox แทน
แบบที่ 1 กดลิงค์เพื่อสลับตัวเลือก
<script type="text/javascript">
function setcheck1(q) {
var check = document.getElementById(q + 'y').checked;
document.getElementById(q + 'y').checked = check ? false : true;
document.getElementById(q + 'n').checked = check ? true : false;
}
</script>
<p><a href="javascript:setcheck1('ch1')" rel="nofollow">ตัวที่ 1</a><input checked="checked" id="ch1y" type="checkbox"><input id="ch1n" type="checkbox"></p>
<p><a href="javascript:setcheck1('ch2')" rel="nofollow">ตัวที่ 2</a><input checked="checked" id="ch2y" type="checkbox"><input id="ch2n" type="checkbox"></p>แบบที่ 2 กดลิงค์เพื่อเลือกของใครของมัน วิธีนี้ผลลัพท์จะคล้ายๆกับการใช้ label ร่วมกับ radio
<script type="text/javascript">
function setcheck2(q, c) {
document.getElementById(q + 'a').checked = c ? true : false;
document.getElementById(q + 'b').checked = c ? false : true;
}
</script>
<p><input checked="checked" id="ch1a" type="checkbox"><a href="javascript:setcheck2('ch1',true)" rel="nofollow">ใช่</a><input id="ch1b" type="checkbox"><a href="javascript:setcheck2('ch1',false)" rel="nofollow">ไม่ใช่</a></p>
<p><input checked="checked" id="ch2a" type="checkbox"><a href="javascript:setcheck2('ch2',true)" rel="nofollow">ใช่</a><input id="ch2b" type="checkbox"><a href="javascript:setcheck2('ch2',false)" rel="nofollow">ไม่ใช่</a></p>