Cycle the selected radio buttons : Radio Button « Form « JavaScript Tutorial






  1. JavaScript Tutorial
  2. Form
  3. Radio Button
<html> 

<head> 
<title>Cycle</title> 
<script type="text/javascript"> 
function getSelectedButton(buttonGroup){ 
    for (var i = 0; i < buttonGroup.length; i++) { 
        if (buttonGroup[i].checked) { 
            return i; 
        } 
    } 
    return 0; 
} 

function cycle(form) { 
    var i = getSelectedButton(form.sizes); 
    if (i+1 == form.sizes.length) { 
        form.sizes[0].checked = true; 
    } else { 
        form.sizes[i+1].checked = true; 
    } 
} 
</script> 
</head> 
<body> 
<form> 
<input type="radio" name="sizes" value="3" checked="checked" />3
<input type="radio" name="sizes" value="2" />2
<input type="radio" name="sizes" value="0" />0
<input type="radio" name="sizes" value="1" />1
<input type="button" name="Cycler" value="Cycle Buttons" onclick="cycle(this.form)" />
</form> 
</body> 
</html>








10.11.Radio Button
10.11.1.Radio
10.11.2.Radio.blur()
10.11.3.Radio.checked
10.11.4.Radio.click()
10.11.5.Radio.defaultChecked
10.11.6.Radio.focus()
10.11.7.Radio.form
10.11.8.Radio.handleEvent()
10.11.9.Radio.name
10.11.10.Radio.onBlur
10.11.11.Radio.onClick
10.11.12.Radio.onFocus()
10.11.13.Radio.type
10.11.14.Radio.value
10.11.15.Checking a Radio Button Group
10.11.16.With with RADIO and CheckBox
10.11.17.Cycle the selected radio buttons
10.11.18.An onclick Event Handler for Radio Buttons