Using a radio button as a toggle controlled by jQuery/Javascript

I have a simple radio button such as:

<input type="radio" id="noexercisebutton">

Open in new window


What I want to do is:

1. When you click the radio button, it selects.
2. When you click it a second time, it de-selects.
3. Additionally, I have Javascript that performs various tasks based on either (1) or (2), so I need to know which occurred.

I know how to make a radio button select or de-select via Javascript... the problem is that all of my event handlers seem to be conflicting with the inherent behavior of radio buttons. I tried "mouseup", but its unclear which happens first... a browsers handling of a radio button, or the timing of when Javascript sees a radio button as either checked or unchecked.

Is there some way to resolve this, or am I attempting something that is going to cause problems in various browsers?

Thank you!
bbdesignAsked:
Who is Participating?
 
leakim971Connect With a Mentor PluritechnicianCommented:
why a radio button button and not a checkbox?
0
 
bbdesignAuthor Commented:
Hmm, good point. Maybe a checkbox would be a better idea.
0
 
bbdesignAuthor Commented:
That's what I'm going to do. Don't know why I didn't think of that, Monday morning and not enough coffee perhaps. Thanks!
0
 
MrunalCommented:
Hi
You can use checkbox for this functionality.

Here is example:

http://jsfiddle.net/Zdrnr/
0
All Courses

From novice to tech pro — start learning today.