Question

我有：

<table id="table" border="1">
    <tr><td>a1</td><td>a2</td><td>a3</td><td>a4</td><td>a5</td></tr>
    <tr><td>b1</td><td>b2</td><td>b3</td><td>b4</td><td>b5</td></tr>
    <tr><td>c1</td><td>c2</td><td class="no">c3</td><td>c4</td><td>c5</td></tr>
    <tr><td>d1</td><td>d2</td><td>d3</td><td>d4</td><td>d5</td></tr>
    <tr><td>e1</td><td>e2</td><td>e3</td><td>e4</td><td>e5</td></tr>
    <tr><td>f1</td><td>ff2</td><td>f3</td><td>f4</td><td>f5</td></tr>
</table>

和

$( "#table" ).selectable({
    filter: 'td:not(.no)',
    stop: function( event, ui ) {
        var selected = $(this).find('.ui-selected');

        console.log(selected);
    }
});

FIDDLE：http://jsfiddle.net/5RxB2/

跳过元素的最佳方法是什么？我想要一个矩形或正方形。

一些例子：

1）我选择了a1，a2，b1，b2 - 这没关系

2）我选择了a1，a2，a3，b1，b2，b3 - 这没关系

3）我选择了a2，b2 - 这没关系

4）我选择了：

a1，a2，a3，a4

b1，b2，b3，b4

c1，c2，a4 // a3 haveclass no

d1，d2，d3，d4

所以，我想收到一个矩形或正方形。这应该总是首先被选中（在这个例子中是a1）并且拒绝除（a1，a2，b1，b2）之外的其他 - 所以这应该从c3（类no）向上和向侧拒绝TD。

这可能吗？如果有，怎么样？：）

Answer 1

选项1）在filter中使用选择器：

$( "#table" ).selectable({
    filter: 'td:not(.no)',
    stop: function( event, ui ) {
        var selected = $(this).find('.ui-selected');

        console.log(selected.filter(':first,:last'));
    }
});

Fiddle

选项2）在find中使用选择器：

$( "#table" ).selectable({
    filter: 'td:not(.no)',
    stop: function( event, ui ) {
        var selected = $(this).find('.ui-selected:first,.ui-selected:last');

        console.log(selected);
    }
});

Fiddle

可选 - 跳过元素

1 个答案: