0

ltをクリックした後に非表示になっている場合.hidden（タイトル、アイコン、またはスペースをクリックしたものをすべて含む）.hiddenが表示されます。.icon次に、クリックだけを.hidden非表示にする方法は？

今は機能しません。クリックして.iconも何も起こりません....icon内部.ltにあるため、クリック.iconする.ltとクリックもトリガーされ、非表示にした後、.ltクリック機能が実行されますか？

$('.lt').on({'click': function() {
    if(!$('.$('.hidden').is(:visible)')){
        var src="b";
        $('.icon img').attr('src', src);
        $('.hidden').show();
    }
});
$('.icon').on({'click': function() {
    if($('.$('.hidden').is(:visible)')){
        var src="a";
        $('.icon img').attr('src', src);
        $('.hidden').hide();
    }
});

<div class="lt">
    <div class="title">
    </div>
    <div class="icon">
        <img src="a">
    </div>
    <div class="hidden">
    </div>
</div>

.hidden{display:none;}
4

2 に答える 2

0

.stopPropagation()必要なものですが、if状態のコードに問題があります:

$('.lt').on({'click': function() {
   if(!$('.hidden').is(':visible')){  //<----change this way here
      var src="b";
      $('.icon img').attr('src', src);
      $('.hidden').show();
   }
});

上記のスクリプトでは、非表示のストレートを確認できますif($('.hidden').is(':hidden')){

ここで.stopPropagation()は、ツリー内の親にバブルアップするイベントを停止するために配置する必要があります。

$('.icon').on({'click': function(e) {
   e.stopPropagation();               //<----it stops the event bubbling
   if($('.hidden').is(':visible')){   //<----this should also be changed to this
      var src="a";
      $('.icon img').attr('src', src);
      $('.hidden').hide();
   }
});
于 2013-06-10T11:57:37.910 に答える