How do I find the previous/default value of a radio button in JS?

Question

I'm not sure if this is even possible, but I figured I'd ask before clubbing togehter an ugly solution.

What I have is a group of radio buttons and I want to trigger a function if the radio button value is changed. For example say there are three buttons X Y and Z with Y default selected. If a user clicks on an unselected button (i.e. X or Z) then the function gets triggered but if he/she clicks on Y (which is already selected) nothing happens.

Naturally the best solution would be to fire the function on an onchange event but IE6 doesn't fire onchange until the focus is no longer on the element which is not satisfactory.

So is there a way to know what the previous value of the radio button was or at least what its default value is? I could easily create an array of default values and check against that but I'm trying to reduce the overhead.

Please no jQuery suggestions ;)

Answer 1

Well, you could use the onmousedown event on the input elements. It would do what you're asking (activate an event when the user clicks), but with onmousedown, you can check if the element was already selected. Example:

document.getElementById('#radio-button-x').onmousedown = function() {
    if (this.checked == true) {
        // was already selected
    } else {
        // not selected, do something
    }
};

Answer 2

Use the defaultChecked property of the input element.

You could also use the click event for this, because click event fires also when the user uses the spacebar/enter key on it to "check" it.