checkbox with style

How do i highlight or bold the checked checkbox?

 

i mean the label of the checkbox

 

<SCRIPT LANGUAGE="JavaScript">
function Bold() {
if (document.all.label.style.fontWeight=='bold') {
document.all.label.style.fontWeight = 'normal';
}
else {
document.all.label.style.fontWeight = 'bold';
}
}
</script>

<form>
<input type=checkbox name=checkbox onClick="Bold()">
<a name="label" id="label">Bold me</a>
</form>

Code (markup):

 

nhl4000:
- document.all is not supported by many browsers
- that script works opposite if user submits form with checkbox checked and then presses back

<script type="text/javascript">
function byId(id) {
  return document.getElementById ? document.getElementById(id) : document.all[id];
}
function bold(checkbox, elementId) {
  byId(elementId).style.fontWeight = (checkbox.checked ? "bold" : "normal");
}
</script>

<form>
  <label id="mycheckboxlabel">
    <input type="checkbox" name="mycheckbox" onclick="bold(this, 'mycheckboxlabel')"> Text
  </label>
</form>

Code (markup):

 

Thanks for the information. I'm a beginner to Javascript.

 

what if incorporate this with a checkbox trapping.

[ ] label a
[ ] label b
[ ] label c

You can select box 1 or 2, but if you select box 3 box 1 AND 2 will de-select, also the box's label must be highlighted when selected.

thanks guys for your help....

 

<script type="text/javascript">
function byId(id) {
  return document.getElementById ? document.getElementById(id) : document.all[id];
}
function bold(checkbox, elementID) {
  byId(elementID).style.fontWeight = (checkbox.checked ? "bold" : "normal");
}
function deselect(checkboxIDs) {
  for (i=0; i<checkboxIDs.length; i++)
    byId(checkboxIDs[i]).checked = false;
}
</script>

<form>
  <label id="mylabel[1]">
    <input type="checkbox" name="mycheckbox[1]" onclick="bold(this, 'mycheckboxlabel')"> Text A
  </label>
  <label id="mylabel[2]">
    <input type="checkbox" name="mycheckbox[2]" onclick="bold(this, 'mycheckboxlabel')"> Text B
  </label>
  <label id="mylabel[3]">
    <input type="checkbox" name="mycheckbox[3]" onclick="deselect(new Array(1,2)); bold(this, 'mycheckboxlabel')"> Text C
  </label>
</form>

Code (markup):

 

thanks for the quick reply ..

but the label it aint workin and also the trapping....


forgot to tell also that if u click on any of box 1 OR 2 box 3 wil de-select

 

<script type="text/javascript">
function byId(id) {
  return document.getElementById ? document.getElementById(id) : document.all[id];
}
function bold(checkbox, elementID) {
  byId(elementID).style.fontWeight = (checkbox.checked ? "bold" : "normal");
}
function deselect(checkboxIDs) {
  for (i=0; i<checkboxIDs.length; i++)
    byId(checkboxIDs[i]).checked = false;
}
</script>

<form>
  <label id="mylabel1">
    <input type="checkbox" name="mycheckbox[1]" onclick="deselect(new Array(3)); bold(this, 'mylabel1')"> Text A
  </label>
  <label id="mylabel2">
    <input type="checkbox" name="mycheckbox[2]" onclick="deselect(new Array(3)); bold(this, 'mylabel2')"> Text B
  </label>
  <label id="mylabel3">
    <input type="checkbox" name="mycheckbox[3]" onclick="deselect(new Array(1,2)); bold(this, 'mylabel3')"> Text C
  </label>
</form>

Code (markup):

Sorry for late reply. I still can't get this thread subscription stuff working how I want!