2012-01-08 7 views
0

仮想デスクトップのように機能するアプリケーションがあります(下部の水平バーのアイコン)。アイコンをクリックすると、ウィンドウが開きます(動的に作成されます)。別の(または同じ)アイコンをクリックすると、別のウィンドウが最後のウィンドウから10px下に開き、10pxが最後から右に開き、上に移動します。ウィンドウを上部に移動するときの問題

ウィンドウが作成されると、以下の関数がクリックイベントをウィンドウに追加して実行します。ウィンドウがクリックされた場合は、ウィンドウが上部に移動します。

問題が発生しました。ウィンドウの1つに画像のサムネイルが含まれています。イメージをクリックすると、フルサイズのイメージで新しいウィンドウが作成されます。私はサムネイルウィンドウ上に新しいウィンドウが作成された後に(moveOnTop関数内の)イベントが発生しないため、フルサイズのイメージを持つ新しいウィンドウを上に配置したい(クリックしたときにそのウィンドウをクリックしたためサムネイルに)。

サムネイルをクリックした場合にイベントが発生するのを防ぐことができれば、私は方法はわかりませんが、これを解決する方法は1つあります。そうでなければ、これを解決する良い方法がありますか?前もって感謝します!サムネイルのクリックイベントハンドラ内

Windows.prototype.moveOnTop = function(){ 
var container = '#desktop'; 

    $(container).on('click', '.window', function() { 
     var thisWindow = $(this); 
     if(thisWindow.next().length > 0){ 
      thisWindow.appendTo('#desktop'); 
     } 
    }); 
}; 

答えて

1

あなたは他の(親)要素のためのイベントをキャンセルすることができます

$("img.thumbnail").on("click", function(e) { 
    ... 

    // Finally, prevent the click event from bubbling up to parent elements 
    e.stopPropagation(); 
}); 

参照:event.stopPropagation()

+0

魅力のように動作します、ありがとう! – holyredbeard

1

状況によって異なります。両方のケースが同じイベントハンドラで処理される場合は、単にevent.targetと比較することができます。

アイコンのclickイベントに別のイベントハンドラをバインドしていて、アイコンをクリックしたときにウィンドウのclickイベントが発生しないようにしようとすると、イベントを許可するかハンドラそうのような、falseを返すかevent.stopPropagation()を呼び出す:

$('.icon').click(function(event) { // <-- parameter 'event' is automatically passed to handlers 
    // Open window with icons 
    event.stopPropagation(); 
}); 

NB:私が言うことができるものから、あなたはまだだ(再)moveOnTop機能にclickハンドラへのすべての窓を取り付けます。ソリューションについては、my answer to your previous questionを参照してください。

+0

私はあなたの答えを確認します、ありがとう! :) – holyredbeard

+0

私はコードを更新しました。これは正しいですよね? – holyredbeard

+0

@ Jason:アプリ全体の初期化時に 'moveOnTop'を1回だけ呼び出す限り、そうです。ウィンドウが作成されるたびに 'moveOnTop'を呼び出すと、あなたはウィンドウを作成するのと同じくらい多くのイベントリスナーを'#desktop'に付けています。 – PPvG

関連する問題