재 바인드 jQuery를 클릭하십시오. AJAX 호출

Question

업데이트 : 저는 단지 내 질문을 검토하기 때문에 이해가 가지 않습니다. 피곤할 때 여기서 질문하지 말아야합니다. 이제 다시 작성되었으며 가능한 솔루션

이 나는 ​​일이 원하는 것입니다 :

1. 사용자가 AJAX 호출이 이루어집니다 클래스 filter_products으로 체크 박스를 클릭합니다.
2. 업데이트 된 제품 목록이 반환됩니다.
3. 업데이트 된 제품 목록은 product_list 내가 hoverintent 이벤트가 다시 결합하는

코드가 원하는 업데이트되었습니다 product_list 후 클래스와 UL의 내용을 대체합니다 :

<div id="sidebar"> 
    <input class="filter_products" type="checkbox" name="product_options[1]" value="1"> 
    <input class="filter_products" type="checkbox" name="product_options[2]" value="2"> 
</div> 

<div id="main"> 
    <ul id="product_list"> 
     <li class="product"> 
      Product name 1 
     </li> 
     <li class="product"> 
      Product name 2 
     </li> 
    <ul> 
</div> 

<script> 
    // Filter products 
    $('.filter_products').on('click', function() { 
     var inputs = $("input:checked"); 
     $.post('/filter_products/' + $('#cat_id').data('cat-id'), inputs.serialize(), function(data) { 
      $('#product_list').html(data); 
     }); 
    }); 

    // Hover product is now wrapped in a function 
    $(".product").hoverIntent({over: getAttributtes, out: hideAttributtes}); 

    function getAttributtes() { 
     // Do something 
    } 

    function hideAttributtes() { 
     // Do something 
    } 
</script> 

이것은 아마도 해결책 :

// Filter products 
$('.filter_products').on('click', function() { 
    var inputs = $("input:checked"); 
    $.post('/filter_products/' + $('#cat_id').data('cat-id'), inputs.serialize(), function(data) { 
     $('#product_list').html(data); 

     // Re-initialize hoverintent 
     hoverAttributtes(); 
    }); 
}); 

// Hover product 
function hoverAttributtes() { 
    $(".product").hoverIntent({over: getAttributtes, out: hideAttributtes}); 
} 

function getAttributtes() { 
    // Do something 
} 

function hideAttributtes() { 
    // Do something 
} 

// Initialize hoverintent 
hoverAttributtes(); 

Answer 1

ick ajax 호출 후 ajax 호출로 업데이트 될 div 외부에이 코드를 넣으십시오. 아약스 업데이트가 아닌 메인 페이지를 의미합니다. 클릭하여이 스크립트를 사용하십시오.

$(document).on('click','.filter_products', function() { 
    var inputs = $("input:checked"); 
    $.post('/filter_products/' + $('#cat_id').data('cat-id'), inputs.serialize(), function(data) { 
     $('#product_list').html(data); 
    }); 
});