0

私は GWT 2.5 を使用しており、あるパネルでいくつかの画像を別のパネルでドラッグ可能およびドロップ可能にしたいと考えています。これは Firefox では問題なく動作しますが、IE9 では動作したくありません。

私はほぼ一日中検索しましたが、その解決策は見つかりませんでした。私が見つけた最高のスレッドは次のとおりです。

GWT 2.4 でのドラッグ アンド ドロップ

GWT ネイティブ ドラッグ アンド ドロップ - DragStartEvent が IE9 で起動しない

違いは、ラベルではなく画像をドラッグしていることです。したがって、これが問題になる可能性があります。

したがって、コードは次のようになります。

// Draggable Image
final Image img = new Image(imageName);
img.addDragStartHandler(new DragStartHandler() {
  @Override
  public void onDragStart(final DragStartEvent event) { 
    event.setData("text", img.getUrl());
  }
});
img.getElement().setDraggable(Element.DRAGGABLE_TRUE);

次に、「ソース」パネルに配置します。

// Image in the source container
wunschContainer = new AbsolutePanel();
img.setPixelSize(size, size);
wunschContainer.add(img, left, top);

画像が正しく表示される (Firefox および IE9)

ターゲット パネルは次のようになります (これは AbsolutePanel のサブクラスであり、HasDragOverHandlers および HasDropHandlers を実装します)。

// Event-handlers for the target container.
this.addDragOverHandler(new DragOverHandler() {
  @Override
  public void onDragOver(final DragOverEvent event) {
  }
});

this.addDropHandler(new DropHandler() {
  @Override
  public void onDrop(final DropEvent event) {
    event.preventDefault();
    final String data = event.getData("text");
    /* ... some more handling ..., creates an image to be displayed here */
    add(image, left, top);
  }
});

Firefox で画像をドラッグすると、マウスポインタの下にドラッグ中の画像が表示されます。IE9では、画像がまったく表示されず、記号だけが表示されます（スラッシュが付いた円、この「許可されていない」記号）。そして、マウスボタンを離しても何も起こりません。IE9モードを使用していて、互換モードがないことも「F12」で確認しました。

何が問題なのか本当にわかりません。コードは問題ないようです (FF で動作します)。GWT-Images で DnD を作成する際に問題はありますか? 興味深いのは、「onDragStart()」メソッドが起動されていることです。しかし、「ドラッグ」は行われていません。

ああ、これをテストするために GWT devmode を使用しています。これは問題になる可能性がありますか？

GWTのみを使用してこれを解決したいと思います。それとも、gwt-dnd のような別のライブラリを使用する必要がありますか? IE9 で動作する単純なGWT DnD を持っている人はいますか? 私がそれを試みた最初の人だとは信じられません:-(。

4

2 に答える 2

1

GWT 2.6 を使用する IE9 で同じ問題が発生しており、onDragStart にデータを設定すると IE9 がオフになることがわかりました。他のすべてのブラウザは正常に動作します。だから私は次のことをやった：

        this.addDragStartHandler(new DragStartHandler(){

        @Override
        public void onDragStart(DragStartEvent event) {
            if(!isIE9()){
                event.setData(RangeSliderControl.KEY, key); // This causes IE9 to not work                  
            }
        }}
    );

もちろん、次のようにコードに isIE9() メソッドを追加しました。

    /**
* Gets the name of the used browser.
*/
public static boolean isIE9() {
    return (getBrowserName().indexOf("msie 9.0") != -1);
};

/**
* Gets the name of the used browser.
*/
public static native String getBrowserName() /*-{
    return navigator.userAgent.toLowerCase();
}-*/;
于 2015-08-06T12:01:50.660 に答える
1

というわけで、本当にいろいろ試した結果、解決策にたどり着きました。

問題は「onDragOver()」メソッドにあるようです。元の質問に投稿したように、メソッドの空の実装があります。

this.addDragOverHandler(new DragOverHandler() {
  @Override
  public void onDragOver(final DragOverEvent event) {
  }
});

これが私が多くのページで見つけた方法です。メソッドが存在する必要があります。存在しない場合、ドラッグ アンド ドロップは機能しません。しかし、IEの場合、デフォルトの動作を防ぐ必要さえあるようです（または何か他のことをします。メソッドをログに記録するだけでは「何か」ではありませんでした）。そこで、「event.preventDefault();」を追加しました。メソッドに、今では動作します。

this.addDragOverHandler(new DragOverHandler() {
  @Override
  public void onDragOver(final DragOverEvent event) {
    event.preventDefault();
  }
});

奇妙なことに、この情報はどこにも見つかりませんでした。これは他の誰かに役立つことを願っています 8-)。

于 2013-03-12T10:11:28.863 に答える