이벤트가 완료된 후 jquery undelegate click 이벤트가 발생했습니다.

Question

일부 AJAX 콘텐츠에서 페이지로 움직이는 클릭 이벤트가 있습니다.

이 콘텐츠가 공개되고 사용자가 프로세스를 활성화 한 동일한 링크를 클릭하면 프로세스를 취소하고 현재 열려있는 즉시 콘텐츠를 닫으려고합니다.

현재 현재 열린 플라이 아웃은 '닫기'링크를 클릭하거나 시퀀스의 다른 플라이 아웃 링크를 클릭하여 닫힙니다. 사용자가 현재 플라이 아웃 링크를 클릭하면 현재 플라이 아웃을 닫고 싶습니다.

// Close fly out function 
function closeFlyout() { 

    $('.fly_container').animate({ 
     'right': '-332' 
    }, 300, 'swing', function() { 
     $(this).detach(); 
     /* TODO: z-index issues in IE7, IE6 
     $('.dark_overlay').fadeOut(300, function() { 
     $(this).remove(); 
     }); 
     */ 
    }); 

}; 

$('.widget').delegate('.widget .fly_out', 'click', function() { 

    /* 
    TODO: z-index issues in IE7, IE6 
    $('body').prepend('<div class="dark_overlay" />'); 
    */ 

    var $widget = $(this).closest('.widget'); 

    var $flyOutIndex = $(this).index('.fly_out'); 

    if ($flyOutIndex == 0) { 
     $flyOutURL = 'Content/HTMLSnippets/Flyouts/Priceassessment/product_order.htm'; 
    } else if ($flyOutIndex == 1) { 
     $flyOutURL = 'Content/HTMLSnippets/Flyouts/PriceHistory/price_history_comparisons.htm'; 
    } else if ($flyOutIndex == 2) { 
     $flyOutURL = 'Content/HTMLSnippets/Flyouts/PriceHistory/price_history_scenarios.htm'; 
    } else if ($flyOutIndex == 3) { 
     $flyOutURL = 'Content/HTMLSnippets/Flyouts/PriceHistory/price_history_analysis.htm'; 
    } 

    $('.current').removeClass('current'); 

    $(this).addClass('current'); 

    // Close any open flyouts 
    closeFlyout(); 

    $.ajax({ 
     type: 'GET', 
     url: DashboardApplicationRoot + $flyOutURL, 
     dataType: 'html', 
     cache: true, 
     success: function(data) { 

      $($widget).prepend(data); 

      $('.fly_container').animate({ 'right': '0' }, 300); 

      $('.scroll').jScrollPane(); 

      $('.striped li:nth-child(even)').addClass('odd'); 

     } 
    }); 

    return false; 

}); 

// Close fly out function 
$('.widget').delegate('.fly_container .close', 'click', function() { 

    closeFlyout(); 

    $('.current').removeClass('current'); 

    return false; 

}); 

Answer 1

.delegate() 검사 선택기이 작업을 수행 할 수 있도록이 이벤트를 얻을 때마다 :뿐만 아니라

$('.widget').delegate('.widget .fly_out:not(.foClose)', 'click', function() { 
    $(this).addClass('foClose'); 
    //rest of current code 
}); 

이 그런 다음 가까운 위임이 새로운 선택을 수신 :

$('.widget').delegate('.fly_container .close, .widget .foClose', 'click', function() { 
    $(this).removeClass('foClose'); 
    //rest of current code 
}); 

foClose 클래스를 추가하면 (또는 이름을 지정하려는 모든 것) 버튼의 클릭 이벤트는 닫는 대리자가 열기보다는 수신 대기에서 처리됩니다. 그런 식으로 클릭하고 처리하면 foClass이 제거되어 다시 플라이 아웃 링크가됩니다.

Answer 2

플라이 아웃을 클릭 할 때 메뉴에 클래스 current이 있는지 테스트합니다. 그렇다면 플라이 아웃을 닫고 아약스 메서드를 실행하지 마십시오.

if ($(this).hasClass("current")) { 
    $(this).removeCLass("current"); 
    closeFlyout(); 
    return; 
}