0

私は独自のツールチップを作成しました.1つのフルスクリーンdiv.over-bgと1つの小さなdivが画面の中央にありますdiv.over-box:

<div class="over-bg" id="over-hat">
    <div class="over-box">        
        <a href="">link</a>
    </div>
</div>

そして、それを表示および非表示にするJS：

    $('.over-bg').click(function(){
       $('.over-bg').fadeOut();//hidding when we click outside .over-box
    });

    $('#over-hat .over-box').click(function(){
        return false;// do nothing when we click into .over-box
    });

すべてが完璧に機能しますが、内部div.over-boxにリンクがあると機能しません。作りたいのですが、その外側をクリックしたときにのみツールチップが閉じます。ただし、リンクは機能する必要があります。何か案は？

4

3 に答える 3

1

2 番目のコード スニペットを次のように変更します。

$('#over-hat .over-box').click(function(e){
   return($(e.target).prop("tagName")=="A");
});

aこれにより、タグがデフォルトのアクションを実行し、他のタグがイベントを無視するのに役立ちます。

于 2013-10-31T17:06:33.300 に答える
0

.over-bgここでは推測ですが、リンクをクリックしたときにフェードアウトしたいようです。その場合、アンカーのデフォルトの動作はイベントをバブルアップさせないことだと思うので、アンカー自体に別のクリック ハンドラーを設定する必要があります。

このフィドルを見てみましょうhttp://jsfiddle.net/TCegn/

于 2013-10-31T17:02:32.350 に答える
0

既にあるものに加えて、次の JQuery ステートメントを追加してみてください。

$('#over-hat .over-box a').click(function(){
    window.location = $(this).attr('href');
});
于 2013-10-31T16:54:13.417 に答える