0

ホバーするとトグルし、クリックすると固定されるdivがあります。ユーザーがページの残りの部分をクリックしたときにdivの固定を解除する関数を追加しようとしています。

私はこれを使ってみました：

$( document ).on('click', function( e ) {
   if( e.target.id != 'dialog-box' ){
      $( ".dialog-box" ).hide();
   }   
});

ただし、アクティベーションdivをクリックしてもdivは非表示になります。

これが私がピンに使用しているjQueryです：

$(document).ready(function(){
    $(".two").hover(function() {
        if (!$(this).data('pinned')) $(".dialog-box").toggle("slow");
    });
$(".two").click(function() {
    $(this).data('pinned', !$(this).data('pinned'));
    });
});

上記の最初のスクリプトを除いて、私が作業しているものをいじくりまわします。

http://jsfiddle.net/XXd5t/1/

4

1 に答える 1

1

divをクリックしたときにイベントのバブリングを停止するだけです。そうすれば、クリックイベントがドキュメントに到達したかどうかがわかります。これは、divをクリックしたことによるものではありません。

http://api.jquery.com/event.stopPropagation/

$( document ).on('click', function( e ) {
    $( ".dialog-box" ).hide();
});

$(".two").click(function(e) {
    e.stopPropagation();
    $(this).data('pinned', !$(this).data('pinned'));
});
于 2012-12-10T15:56:44.340 に答える