WoocommerceチェックアウトのためのフロントエンドJSのオーバーライド

Question

住所確認スクリプトを使用するためにチェックアウトページが読み込まれるときに、請求先住所、市区町村、州および郵便番号のフィールドを非表示にする必要があります。以下のコードは私たちが望むものを達成しますが、それはプロセスの遅すぎです。プロセスで遅すぎるupdated_checkoutイベントが実行されるまで、フィールドが表示されます。しかし、それを表示するには他の何かが強制されるので、init_checkoutで実行するのは早すぎるようです。 init_checkoutとupdated_checkoutの間に何かがありますか？

jQuery("body").on("updated_checkout", function() { 
    jQuery("#billing_country_field, 
    #billing_address_1_field 
    #billing_address_2_field, 
    #billing_city_field, 
    #billing_state_field, 
    #billing_postcode_field").css("display", "none"); 
}); 

Answer 1

DOMが最初に読み込まれると、フィールドはとにかく表示されます。

私が "身体" から委任利用可能なすべてのjavascriptのイベントで試してみました：added_to_cartadding_to_cartchangeclickcountry_to_state_changedcountry_to_state_changinginit_checkoutupdate_checkoutupdated_wc_divwc_fragment_refreshwc_fragment_refreshed。 フィールドは常に少し表示されます。

唯一の方法は、あなたのアクティブなテーマstyles.cssファイルに追加され、いくつかのCSSルールをロードするときにチェックアウトフォームを非表示にすることです：

form.checkout.woocommerce-checkout{ 
    visibility:hidden; 
    opacity:0; 
} 

そして、最初表示する前に、あなたのフィールドを非表示になるのjQueryのビットチェックアウトフォーム：

add_filter('wp_footer', 'custom_checkout_script'); 
function custom_checkout_script(){ 
    if(! is_checkout()) return; 
    ?> 
    <script type="text/javascript"> 
    jQuery(function($){ 
     var events = 'update_checkout', 
      billingFields = '#billing_country_field,#billing_address_1_field,#billing_address_2_field'; 
     billingFields += ',#billing_city_field,#billing_state_field,#billing_postcode_field'; 

     $('body').on(events, function(){ 
      $(billingFields).hide(0,function(){ 
       $('form.checkout.woocommerce-checkout').css('visibility','visible').fadeIn({ duration: 1000 }); 
      }); 
     }); 
    }); 
    </script> 
    <?php 
} 

このコードは、任意のプラグインファイルでも、あなたのアクティブな子テーマ（またはテーマ）のfunction.phpファイルになりますか。

すべてのコードは、Woocommerce 3+でテストされ、動作します。