jQueryのファンシーボックスのリンク内のdiv

Question

私には情報を含むdivがあります。 divの周りを包み込み、ユーザーがdivの周りのどこかをクリックすると、fancyボックスが開くように 'a'タグがあります。

div内の他のリンクは、ファンシーボックスを開く代わりにクリックするとdiv全体が削除されました。私は働いていた削除のクリックイベントでfalseを返しました。

新しく作成されたelemnetがクリックイベントを取得していなかったため、クリックに.liveを追加する必要がありました。

それ以来、削除リンクをクリックするとdivは削除されますが、ファンシーボックスも開きます。

ありがとうございました。 DIVのクリックイベント関数内

 $(".listContent").live('mouseenter', function(){ 
     $(this).fancybox({ 
      'type':'ajax', 
      }); 
     }); 

     $("div.removeCompare").live("click", function() { 
      $(this).parents(".listingContainer").remove();           
      return false; 
     });   

本部

  <div class="listingContainer grid_9 alpha omega">      
       <a class="listContent" href="adContent.html"> 
        <div class="listingWrapper"> 
         <div class="grid_8 alpha omega"> 
         <div class="listingContent"> 
          <div class="imgHolder"> 
           <img src="imgs/cars/SearchThumb-10053325.jpg" width="100" height="75"> 
          </div> 
          <div class="descHolder"> 
           <div id="cars"></div>        
           <h3>Fancy Car</h3><div class="removeCompare">Remove</div> 
           <p>Lorem ipsum dolor sit amet, pri ex duis maiorum commune, illud viderer suscipiantur eam an. Dolorum recteque qui in. Pro inani nulla tacimates ex, qu</p> 
           <span class="listingPrice">€4,000</span> 
           <span class="listingDate">Listed: Today</span> 
           <span class="listingLocation">Co. Waterford</span> 
           <span class="listingViews">Viewed: 20 Times</span> 
          </div> 
         </div> 
        </div> 
        <div class="goTo goTo_unfocus grid_1 alpha omega"> 
         <div class="gotoWrapper"> 
           Click to View 
           <div class="imgVeiw"></div> 

          </div> 
         </div> 
        </div><!--End listingWrapper--> 
       </a> 
      </div> 

Answer 1

更新日： This code

$(".listContent").live('click', function(e) { 
    e.preventDefault(); 
    $(this).fancybox({ 
     'type': 'ajax' 
    }); 
    console.log('inside fancybox creator'); 
}); 

$("div.removeCompare").live('mousedown', function(e) { 
    e.stopPropagation(); 
    console.log('inside remove'); 
    $(this).parents(".listingContainer").remove(); 
}); 

私はあなたの問題はevent propagationでだったと思う - あなたは子要素をクリックすると、親の関連イベントは、あまりにも起動します。だからe.stopPropagation()はそれを止めるでしょう。

Answer 2

、.die（ 'のMouseEnter'）イベントハンドラを使用して、（fancyboxを開きます）内側の要素のMouseEnterイベントをバインド解除構文を解く。