jQuery UI Selectable似乎是正确的工具,但我遇到的问题是功能似乎绑定到所有子元素,并且所有类都被应用.

我想确保事件的类和绑定仅应用于第一代子代,而不是它们的嵌套元素.

这是一个jsFiddle,它应该有助于说明我想要阻止的内容：http://jsfiddle.net/ncKEW/

代码
HTML

<div id="group">
    <div class="unit">
        <h2>Title</h2>
        <div class="content">
            Dulce et decorum
        </div>
    </div>
    <div class="unit">
        <h2>Title</h2>
        <div class="content">
            Dulce et decorum
        </div>
    </div>
    <div class="unit">
        <h2>Title</h2>
        <div class="content">
            Dulce et decorum
        </div>
    </div>
    <div class="unit">
        <h2>Title</h2>
        <div class="content">
            Dulce et decorum
        </div>
    </div> </div>

JS

$(document).ready(function(){
    $('#group').selectable();
});

Css(仅用于说明)

#group{padding: 12px;}
h2{font-size: 1.2em;margin: 2px 0;}
.unit{background: blue;}
.ui-selected{background: yellow;}