Why Internet Explorer checkbox accepts double click but changing state only once?

Question

In Internet Explorer (any version) if you click twice fast a checkbox it changes only once. Another browsers don\'t do this.

This is \"by design\" or a very strange beha

Answer 1

Workaround / Solution

Using jQuery i fixed the problem like this:

this.checkboxes = $('input[type="checkbox"]');
if (navigator.userAgent.match(/MSIE/i)){
        this.checkboxes.dblclick(function() {
            if($(this).prop('checked')) {                       
                $(this).prop('checked', false);
            } else {
                $(this).prop('checked', true);
            }
        });
}
this.checkboxes.click(function(e) {                 
    // do whatever a click should do                                        
});

Explanation: On a double click in Internet Explorer, the events are fired like this:

1. Click
2. Click
3. Double Click

On a double click, the desired action in my click event happened twice (like it should), but the checkbox did not change states twice. So i simply toggled the checked/unchecked-state again when a double click fires. As this would break functionality in Firefox/Chrome/etc, i only used it in MSIE (Internet Explorer) user agents.

With the code above, the events and checkbox-states fire/change like this:

Double Click in All Browsers except IE:

1. Click (change state, fire click event)
2. Click (change state, fire click event)

Double Click on a checkbox in Internet Explorer

1. Click (change state, fire click event)
2. Click (fire click event)
3. Double Click (change state (via double click event))