<button> element that does not propagate events in Firefox?

I see problems in Firefox 4.0.1, where event propagation does not seem to work as I expected. Let's say I have the following HTML:

<button>
    <input id='cb' type='checkbox' checked='true'>
    <span> foo</span>
</button>

and javascript:

$(document).ready(function() {
    $("button").click(function(e) {
        console.log('got click: button');
        return true;
    });
    $("#cb").click(function(e) {
        console.log('got click: checkbox');
        return true;
    });
});

See: http://jsfiddle.net/H7fp3/10/

This behaves as I expected in Chrome (12) and Safari (5.0.5):

  • Click on the checkbox:, got click: checkboxthengot click: button
  • Press the button alone, you will receive: got click: button

However, in Firefox (4.0.1), got click: buttonthe checkbox checked attribute is created and does not change. Am I missing something? Is Firefox the correct click of an event button?

+3
source share
1 answer

, Firefox . W3C <input> <button>.

, checked="true" checked="checked", ( ).

+2

All Articles