1

ほぼフルページの Google マップ ウィンドウを備えた GWT Web アプリがあります。マップ内には、リンクを含む情報ウィンドウがあります。私がやりたいことは、jquery ツール オーバーレイ ( http://flowplayer.org/tools/overlay/apple.html ) を使用してオーバーレイを開き、情報ウィンドウ内のリンクをクリックするとマップの上に表示することです。

現在、リンク ソースは動的に生成され、別のサーバーでホストされているため、開く前に iframe で開き、iframe のソースを設定する必要があります。ページにiframeが1つしかないので、これは簡単に思えます:

    function changeSource(url){
         $("#menuIFrame").attr("src",url);
    }

オーバーレイを開く前にこれを呼び出すには (マウスのリリース時に行われます)、GWT を介して Google マップの情報ウィンドウに次の要素を作成します。

<a href="http://whatever.com/menu/" onClick="changeSource('http://whatever.com/menu/');" rel=#menu"> View menu </a>

Jquery ツールは、「rel」の値に ID が割り当てられている div を開くことで機能しますが、GWT の LandingPage.html に javascript/jquery があるため、オーバーレイがウィンドウに追加されませんでした。

ここに私のアプリがあります: http://truxmapper.appspot.com/

ご覧のとおり、他のオーバーレイは問題なく動作しますが、情報ウィンドウをクリックしてメニューを表示しようとすると、単に href を使用してそのウィンドウで URL が開きます。

私の目標を達成できる解決策を知っている人はいますか? ありがとう！

4

2 に答える 2

2

リンクをクリックすると、現在のウィンドウでページが開きます。それを止めるものは何もありません。リンクのonclickハンドラーは、デフォルト アクション (URL を開く) が発生しないように false を返す必要があります。次のようになります。

<a href=".." onClick="changeSource(..); return false;" rel=#menu">View menu</a>

changeSourceが呼び出された後に false が返されることに注意してください。またはchangeSource、値自体を返すように変更して、単に changeSource が返すものを返すこともできます。changeSource 関数は次のようになります。

function changeSource() {
    // do some work
    return false;
}

リンクは次のようになります。

<a href=".." onClick="return changeSource(..);" rel=#menu">View menu</a>

これにより、ページの移動が停止し、それ以降は期待どおりに動作するはずです。そうでない場合は、jQuery ツールに問題がある可能性が高くなります。私のテストでは、ポップアップ ウィンドウはデフォルトで<div class="menu_overlay">..</div>は表示されず、CSS で非表示になりました。onClick を次のようにさらに変更して、それを表示するためにさらにハッキングを行いました。

onClick="$('.menu_overlay').show(); return changeSource(..);"
于 2010-05-28T02:09:14.600 に答える
1

この回答は、私が役立つと思った情報を提供してくれましたが、私が見つけた「解決策」は含まれていませんでした。

jQueryツールで使用される「a [rel]」jQueryセレクターをトリガーするGWT内からのリンクを持つ方法が見つかりませんでした。ただし、javascript関数にするので、オーバーレイを宣言するだけです:

$(function() {
$("#menu").overlay({effect: 'apple', mask: 'gray'});

});

changeSource 関数を次のように変更しました。

    function changeSource(url){
    $("#menuIFrame").attr("src",url);
    $("#menu").overlay().load();
}

ここで、GWT 内からのリンクは href="javascript:changeSource('menu_url.html');" です。これは適切に機能しているようです。

ありがとう。

于 2010-05-28T04:54:01.977 に答える