การทำ highlight แถวเมื่อเลือก checkbox

เทคนิคการเปลี่ยนสีพื้นเมื่อทำการเลือก checkbox ในแถว

<style type="text/css">
.selected {
  background-color:#DDDDDD;
}
.selected1 {
  background-color:#EEEEEE;
}
.unselected {
  background-color:red;
}
</style>

<table>
<?
  for ($i=1; $i<5; $i++) {
    $class = ($class=='selected1') ? "selected" : "selected1";
    echo "<tr id=\"item$i\" class=\"$class\"><td><input type=\"checkbox\" name=\"item$i\" onclick=\"doclick(this, $i)\"></td><td>รายการที่ $i</td></tr> ";
  }
?>
</table>
<script type="text/javascript">
function doclick(obj, index) {
  if (obj.checked) {
    document.getElementById(obj.name).className="unselected"
  } else {
    if (index%2==0) document.getElementById(obj.name).className="selected"
    else document.getElementById(obj.name).className="selected1"
  }
}
</script>
ผู้เขียน goragod โพสต์เมื่อ 02 เม.ย. 2551 เปิดดู 11,632 ป้ายกำกับ JavascriptCSS
^