gpt4 book ai didi

javascript - Woocommerce 变体

转载 作者:太空宇宙 更新时间:2023-11-04 15:26:32 29 4
gpt4 key购买 nike

我有 woocommerce 设置,其中包含产品和这些产品的变体。当我更改变化时(例如,产品的尺寸(340克或900克),我希望它在页面上动态更新价格,以便人们可以看到两种尺寸之间的价格差异。目前,我什至无法获取变体的变体 ID。这似乎根本不起作用。

如果我测试并修改变体,这就是我从 Javascript 控制台获得的全部内容:

enter image description here

这是我的代码:

// removing the price of variable products
remove_action( 'woocommerce_single_product_summary','woocommerce_template_single_price', 10 );

// Change location of
add_action( 'woocommerce_single_product_summary', 'custom_wc_template_single_price', 10 );

function custom_wc_template_single_price(){
global $product;

// Variable product only
if($product->is_type('variable')):

// Main Price
$prices = array( $product->get_variation_price( 'min', true ), $product->get_variation_price( 'max', true ) );
$price = $prices[0] !== $prices[1] ? sprintf( __( 'From: %1$s', 'woocommerce' ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );

// Sale Price
$prices = array( $product->get_variation_regular_price( 'min', true ), $product->get_variation_regular_price( 'max', true ) );
sort( $prices );
$saleprice = $prices[0] !== $prices[1] ? sprintf( __( 'From: %1$s', 'woocommerce' ), wc_price( $prices[0] ) ) : wc_price( $prices[0] );

if ( $price !== $saleprice && $product->is_on_sale() ) {
$price = '<del>' . $saleprice . $product->get_price_suffix() . '</del> <ins>' . $price . $product->get_price_suffix() . '</ins>';
}

?>
<style>
div.woocommerce-variation-price,
div.woocommerce-variation-availability,
div.hidden-variable-price {
height: 0px !important;
overflow:hidden;
position:relative;
line-height: 0px !important;
font-size: 0% !important;
}
</style>
<script>

jQuery(document).ready(function($) {

$('select').blur( function(){
console.log("blur");
if( '' != $('input.variation_id').val() ){
console.log($('input.variation_id'));
console.log($('input.variation_id').val());
$('p.price').html($('div.woocommerce-variation-price > span.price').html()).append('<p class="availability">'+$('div.woocommerce-variation-availability').html()+'</p>');
console.log($('input.variation_id').val());
} else {
$('p.price').html($('div.hidden-variable-price').html());
if($('p.availability'))
$('p.availability').remove();
console.log('NULL');
}
});
});
</script>
<?php

echo '<p class="price">'.$price.'</p>
<div class="hidden-variable-price" >'.$price.'</div>';

endif;
}

这是网站:https://bricksandmortar.ca/product/no-eye-contact/#

有什么想法吗?

最佳答案

您可以使用一些 jQuery 连接到 show_variation 触发器,以获取有关所选变体的所有信息。下面的示例将以 HTML 格式将价格写入控制台。

(function( $ ) {
'use strict';
$(function() {

var $variation_form = $( '.variations_form' );

$variation_form.on( "show_variation", function ( event, variation ) {
// Fired when the user selects all the required attributes
console.log(variation.price_html);
} );

});

})( jQuery );

关于javascript - Woocommerce 变体,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47372921/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com