Hi all,

I've got a really pesky issue. For some reason, Firefox (both version
2 and 3) is firing multiple click events on checkbox elements. This
isn't happening in IE, Chrome, or Safari. I'm using event delegation,
in the form of a plugin that looks like this:

(function($) {
        $.fn.delegate = function(eventType, rules) {
                var i = 0;
                return this.bind(eventType, function(e) {
                        var target = $(e.target);
                        for (var selector in rules) {
                                if (target.is(selector)) {
                                        $.debug(i++ + ". selector: " + 
selector);
                                        return rules[selector].apply(this, 
arguments)
                                }
                        }
                })
        };
})(jQuery);

The var i  = 0 and $.debug() method call lines are there to assist in
debugging.

The code delegates clicks within a certain element as follows:

$filter.children(".container, .hierarchy-container").delegate("click",
{
        ".filter-label input:checkbox": function(e) {
                $.debug("click: .filter-label input:checkbox");
                e.stopPropagation();
        },
        ".close-filter-a, .child0 .close-filter-a":     function(e) {
                $.debug("click: .close-filter-a");
                close($filter);
                e.stopPropagation();
        },
        ".result-count a":      function(e) {
                $.debug("click: .result-count a");
                e.stopPropagation();
        },
        "li.more p a":          function(e) {
                $.debug("click: li.more p a");
                e.stopPropagation();
        }
});

The delegate() method takes two parameters, 1) the name of the event
on which attach handlers, and 2) an object consisting of jQuery
selectors acting as keys to the functions that should handle wrapped
sets selected by 1). Everything works as expected, except for the
checkboxes selected by the pattern ".filter-label input:checkbox." In
Firefox, these handlers are always executed twice.

To illustrate the issue, I've uploaded the code here:

http://69.59.182.148:4080/test/06082008/html-scaffolding/filters.html

Click on "Multi-select Filter Name." Click on/off checkboxes, and
notice the output in the Firebug console. Notice that two handlers are
being invoked for every event. However, if you click on the "more >>"
link in the lower right-hand corner, only one event is fired.

I've been struggling with this for days. Any help would be *greatly*
appreciated.

Kind regards

--Bill

Reply via email to