Question

I’m having an issue with a jQuery UI selectable div that contains child divs. Specifically the child div’s don’t get selected until I set a breakpoint inside the selected handler.

I’ve put together a reproduction on JS Fiddle:

http://jsfiddle.net/PjS3x/9/

To view the behaviour:

1. click the “click me” button a couple times.
2. click on the black and green squares
3. notice that the ID (0, 1, 2, etc) of the main div is printed, but that the child div (test0, test1, etc) is not printed or is printed inconsistently when clicking on green.
4. Set a breakpoint on this line $("#log").append("<span>" + $(ui.s....
5. Notice that two events are reliably fired, once for each selectable.

I’ve reviewed the API Documentation for JQuery Selectable, but I can’t see any options that would influence this behaviour.

Answer 1

I found that the child divs are only selected when the mouse moves while clicking.

I am still unsure how the breakpoint influences the click event.