0
var bar = $('.div_layer_Class');
  $('a.second_line').click(function() {
      $(this).unbind('mouseout');
  }).mouseover(function() {
      bar.css('display','inline');
  }).mouseout(function() {
      bar.css('display','none');
  });

体のどこかをもう一度クリックすると、「onBodyclick」の問題が発生します。mouseouteventこのようなものを呼び出したいです。

$('body').click(function() {
      bar.css('display','none');
 event.preventDefault();

  });

これを行うと、イベントと重複し$('a.second_line').click(function()ます。どうすればこれを達成できるか考えてみてください。

http://jsfiddle.net/qGJH4/56/

4

2 に答える 2

1

に加えてe.stopPropagation()、次の2つのことができます。

  • mouseoutイベントハンドラーを参照する変数を作成して、ユーザーが本文の他の場所をクリックするたびに再バインドできるようにします。また
  • a.second_lineがフォーカスされているかどうかに格納する変数。何かのようなもの var focused = false;

コードは次のようになります。

var bar = $('.div_layer_Class');
var focused = false;
$('a.second_line').click(function(e) {
    focused = true;
    e.stopPropagation();
}).mouseover(function() {
    bar.css('display','inline');
}).mouseout(function() {
    if (!focused)
        bar.css('display','none');
});

$(document).click(function(e){
    bar.css('display','none');
    focused = false;
});
于 2012-06-13T04:26:26.827 に答える
0

ここでの例 コードをこれに変更してみてください

var bar = $('.div_layer_Class');
$('a.second_line').click(function(e) {
    bar.addClass('on');
    e.stopPropagation();
}).mouseover(function() {
    bar.css('display','inline');
}).mouseout(function() {
   if(!bar.hasClass('on'))
       bar.css('display','none');
});

$(document).on('click',function(){
  bar.removeClass('on');
  bar.css('display','none');
  //return false;
});

最初に見るべき2行function(e)

$('a.second_line').click(function(e) {

と停止e.stopPropagation();

これにより、基本的に親ハンドラーへの通知が停止します。ここを読む

于 2012-06-13T02:53:33.660 に答える