2017-11-23 4 views
1

enter image description hereWoocommerce : 사용자 정의 JQuery와 이벤트 후 장바구니에 추가

임, 나는 "의 총 수를 그 순간 업데이트를 잡을 원하는 일부 제품은 카트 (그림 1 개 조치)에 추가 된 후 이벤트를 처리 (아카이브) 시도 내비게이션 메뉴에있는 내 미니 카트의 "제품"(그림에 3 액션)을 추가하십시오. 내가 두 번째 코드가 작동하지

(행동이 모든 괜찮습니다) : woocommerce JS 파일을로드 할 때 후 inited는

$(document.body).on('added_to_cart', function(){ 
console.log('added_to_cart'); 
}); 

내 사용자 지정 코드는.

add-to-cart.min.js 코어 파일을 편집하고 내 논리를 삽입하면 모두 작동합니다. 무슨 문제가 있니?

+0

귀하의 질문에 더 자세히 설명되어 있어야합니다. 그리고 미안하지만, 당신이하고 싶은 말을 이해하기가 약간 어렵습니다. 자아를 더 잘 설명해주세요. –

+0

일부 제품이 장바구니에 추가 된 후 이벤트를 처리하려고하는데, 그 순간을 파악하고 탐색 메뉴의 미니 카트의 "총 제품 수"를 업데이트하고 싶습니다. – Vital

답변

1

업데이트 jQuery를위한 워드 프레스에서

, 당신은 jQuery 대신 별명 $의 사용이 먼저 필요하고 "준비"를 지정해야한다 (당신의 jQuery 스크립트 관련) DOM을 완전히로드 할 수 있도록 상태. 내가 코드 아래 테스트 한 브라우저 콘솔에서 "added_to_cart"JS 이벤트를 트리거 작품, 한 번 제품을 쇼핑 카트에 추가됩니다

add_action('wp_footer','custom_jquery_add_to_cart_script'); 
function custom_jquery_add_to_cart_script(){ 
    if (is_shop() || is_product_category() || is_product_tag()): // Only for archives pages 
     ?> 
      <script type="text/javascript"> 
       // Ready state 
       (function($){ 

        $(document.body).on('added_to_cart', function(){ 
         console.log('EVENT: added_to_cart'); 
        }); 

       })(jQuery); // "jQuery" Working with WP (added the $ alias as argument) 
      </script> 
     <?php 
    endif; 
} 

코드 활성 자식 테마의 function.php 파일에 간다 (또는 테마) 또는 모든 플러그인 파일에서.

제품이 장바구니에 추가되면 브라우저 콘솔에 "added_to_cart"라는 문자열이 표시되므로 예상대로이 방식으로 작동합니다.


원래 답 :

미니 카트 업데이트/새로 고침이 정말 필요하지 않습니다 jQuery를하지만,이 예에서와 같이, 전용 woocommerce_add_to_cart_fragments 액션 후크에 걸려 사용자 정의 PHP 함수 위치를 아이콘 수와 제품이 장바구니에 추가 될 때마다 컨텐츠가 새로 고쳐집니다.

카트 아이콘 예를 계산 새로 고침 :

add_filter('woocommerce_add_to_cart_fragments', 'wc_mini_cart_refresh_items'); 
function wc_mini_cart_refresh_items($fragments){ 
    ob_start(); 
    ?> 
    <div class="mini-cart-content" style="display:none;"> 
     <?php woocommerce_mini_cart(); ?> 
    </div> 
    <?php 
     $fragments['.mini-cart-content'] = ob_get_clean(); 
     return $fragments; 
} 

코드 활성 자식 테마 (또는 테마)의 function.php 파일에 간다 : 미니 카트 콘텐츠 예를 새로 고침

add_filter('woocommerce_add_to_cart_fragments', 'wc_mini_cart_refresh_number'); 
function wc_mini_cart_refresh_number($fragments){ 
    ob_start(); 
    ?> 
    <div class="mini-cart-count"> 
     <?php echo WC()->cart->get_cart_contents_count(); ?> 
    </div> 
    <?php 
     $fragments['.mini-cart-count'] = ob_get_clean(); 
    return $fragments; 
} 

을 또는 모든 플러그인 파일에도 포함될 수 있습니다.

테스트를 거쳐 작동합니다. 당신이 기타 관련 jQuery를 "몸"위임 이벤트를 사용해야하는 경우가 카트 관련 이벤트가로


, 당신은 너무 wc_fragment_refresh 또는 wc_fragments_refreshed를 사용할 수 있습니다.

+0

코드를 보내 주셔서 감사합니다. 그러나 "jQuery 기반 이벤트"가 필요합니다. "added_to_cart" – Vital

+0

@Vital 질문이 너무 명확하지 않습니다.이 jQuery 코드 (hooked, template 또는 registered)를 어떻게 설정하고 있는지, 단일 제품 페이지 또는 상점 아카이브 (또는 제품 코드가 포함 된 다른 곳)에 ...) ... 좀 더 자세히 설명해주십시오. 감사합니다. – LoicTheAztec

+0

그림이 추가되었습니다. 모두 상점 아카이브에 있습니다. – Vital