Gwt 吕震中本：可移动的多点选举，鼠标下移事件？

我有一个CellTable，它有4列：

| Column 1 | Column 2 | Column 3 | Column 4 |

目标：

用户可以在按住鼠标键并将鼠标悬停在列上的同时选择多个列

e、 g用户单击第1列并按住鼠标按钮，移动到第2列和第3列上，从而选中第2列和第3列

我试过：

final MultiSelectionModel<data> selectionModel = new MultiSelectionModel<BestellungData>();
    cellTable.setSelectionModel(selectionModel);

    cellTable.addCellPreviewHandler(new Handler<data>()
            {

                @Override
                public void onCellPreview(
                        CellPreviewEvent<data> event) {
                    // TODO Auto-generated method stub
                    if ("click".equals(event.getNativeEvent().getType())) {

                        selectionModel.setSelected(event.getValue(), true);

                    }
                }


    });

final MultiSelectionModel selectionModel=new MultiSelectionModel（）；
cellTable.setSelectionModel（selectionModel）；
addCellPreviewHandler（新处理程序（）
{
@凌驾
公共void oncell预览(
CellPreviewEvent事件）{
//TODO自动生成的方法存根
如果（“单击”.equals（event.getNativeEvent（）.getType（）））{
selectionModel.setSelected（event.getValue（），true）；
}
}
});

但是它不起作用。

试试这个

private boolean isFocus, isFocusMouseDown;
private int lastStyledRow = -1;
private Set<Integer> columns = new HashSet<Integer>();

...

table.addCellPreviewHandler(new Handler<Contact>() {

    @Override
    public void onCellPreview(CellPreviewEvent<Contact> event) {
        if ("focus".equals(event.getNativeEvent().getType())) {
            isFocus = true;
            if (lastStyledRow != -1) {
                NodeList<TableCellElement> cells = table.getRowElement(lastStyledRow)
                        .getCells();
                for (int col : columns) {
                    cells.getItem(col).removeClassName("selectedCell");
                }
                columns.clear();
            }
        }
        if ("blur".equals(event.getNativeEvent().getType())) {
            isFocus = false;
            isFocusMouseDown = false;
            lastStyledRow = event.getIndex();

            NodeList<TableCellElement> cells = table.getRowElement(event.getIndex())
                    .getCells();
            for (int col : columns) {
                cells.getItem(col).addClassName("selectedCell");
            }
        }

        if ("mousedown".equals(event.getNativeEvent().getType()) && isFocus) {
            isFocusMouseDown = true;
        }

        if ("mouseover".equals(event.getNativeEvent().getType()) && isFocusMouseDown) {
            columns.add(event.getColumn());
        }
    }

});

在上面的代码中，我们正在侦听一些事件，根据它们的顺序，我们可以识别所选的列

事件顺序：

• 起始点是任何列上的

  focus

  事件
• 然后

  mousedown

  事件开始在其他列上拖动
• 如果

  focus

  和

  mousedown

  均为真，则收集

  mouseover

  事件上的所有列
• 最后，在

  blur

  事件中，更改所有选定单元格的样式
• 在下一次

  focus

  事件中重置上次选定单元格的样式

快照

---

MultiSelectionModel

用于选择多行，而不是多列。hm甚至可以选择多列吗？我已经在Chromium 33.0.1750.152中对此进行了测试，但不幸的是，

mousedown

事件正好发生在

focus

事件之前，因此它不起作用。如果我在列标题上尝试它，它也不起作用，因为我只收到

焦点

和

模糊

事件，其他什么都没有（没有

mousedown

或

mouseover

）。你能在Firefox上验证一下吗？同时我也在Chrome上测试它。它在Chrome版本33.0.1750.154上也可以正常工作。我已经更新了我的帖子和快照。

.selectedCell{
    border: 2px solid #F3F7FB;
    background-color: #F00;
    font-weight: bold;
}