根据WooCommerce单个产品页面中的尺寸计算价格

时间:2019-03-13 09:07:52

标签: javascript jquery wordpress woocommerce dimensions

基于Get selected variation price in jQuery on Woocommerce Variable products回答代码,
在我的代码行中,我对WooCommerce变量产品的价格计算存在疑问。

根据下拉菜单中选择的选项,价格乘以10或1000,这是不应该发生的,我也不知道为什么会发生。

这是我的代码:

<script>
    jQuery(function($) {
        var jsonData = <?php echo json_encode($variations_data); ?>,
            inputVID = 'input.variation_id';

        $('input').change( function(){
            if( '' != $(inputVID).val() ) {
                var vid      = $(inputVID).val(), // VARIATION ID
                    length   = $('#cfwc-title-field').val(), // LENGTH
                    diameter = $('#diameter').val(),  // DIAMETER
                    ene_enden = $('#id_dropdown_one_end').find('option:selected').attr("value_one_end"),
                    vprice   = ''; // Initilizing

                // Loop through variation IDs / Prices pairs
                $.each( jsonData, function( index, price ) {
                    if( index == $(inputVID).val() ) {
                        vprice = price; // The right variation price
                    }
                });
                var rope_price = (length*vprice) + ene_enden;
                if (rope_price != 0){
                    $('.price').html(rope_price+',-');
                }

                alert('variation Id: '+vid+' || Lengde: '+length+' || Diameter: '+diameter+' || Variantpris: '+vprice+ ' || Rope price: '+rope_price+' || ene_enden = '+ene_enden);

            }
        });
    });
</script>

Picture of product page

由于某些原因,当为“我要结束头像”选择的选项为“正在修改”(其值为0)时,rope_price乘以10或与0串联。当我将选择的选项更改为其他选项时,rope_price乘以1000或与00串联。我不知道为什么会这样。 有什么想法吗?

1 个答案:

答案 0 :(得分:2)

因为要串联字符串。 1 + 0"1" + "0"不同,您可以在此处查看:

console.log("1 + 0 =", 1 + 0);
console.log('"1" + "0" =', "1" + "0");

从HTML对象获取值时,会将其作为字符串接收。如果要将其用作数字,则必须先进行转换。您可以使用NumberparseFloat(甚至可以使用parseInt,但会删除小数)。

var oneNumber = 1;
var oneString = "1";
var oneConverted = Number(oneString);

console.log("typeof oneNumber:", typeof oneNumber);
console.log("typeof oneString:", typeof oneString);
console.log("typeof oneConverted:", typeof oneConverted);

console.log("oneNumber + oneNumber =", oneNumber + oneNumber);
console.log('oneString + oneString =', oneString + oneString);
console.log('oneConverted + oneConverted =', oneConverted + oneConverted);

您遇到的确切问题是ene_enden变量是var rope_price = (length*vprice) + ene_enden;行中的字符串。当您将两个字符串相乘时,它们会自动转换为数字(您的(length*vprice)),但是当您将该数字连接到另一个字符串时,它们会再次自动转换为字符串(您的+ ene_enden),因此您必须先将ene_enden转换为数字,最好将所有预期的数字变量转换为数字。