opencart - 期权变更的价格自动更新(jquery)

时间:2012-08-16 08:56:33

标签: jquery option product opencart

我必须稍微修改一下opencart商店系统,以便自动更新产品价格,所以我找到了一个脚本,我已经修改了一下但是现在遇到了问题。

从div获取的原始价格,使用所选收音机或选择选项中的值进行更新。 但是,当我在产品中有多个选项(多个选择或无线电)时,价格不会相应地更新:始终获取原始价格(从脚本中获取),当更改另一个选项时,它不会使用更新后的价格更新。 除此之外:当您选择一个选项,然后再选择另一个选项并再次更改第一个选项时,它不会再改变任何内容。

Jquery脚本:

$(document).ready(function() {
   $('.option').change(function() {
   var OriginalPrice = $('#thisIsOriginal').text();
   OriginalPrice = OriginalPrice.replace( /,/,"." );

   var OriginalCurrency = OriginalPrice.substring(OriginalPrice.length - 1, OriginalPrice.length);
   OriginalPrice = OriginalPrice.substring(0,OriginalPrice.length - 1);

   if($('.option :checked').val()) {
    var newPriceValue = $('.option :checked').attr("id");
    newPriceValue = $("label[for='" + newPriceValue + "']").text();
   }
   if($('.option :selected').val()) {
    var newPriceValue = $('.option :selected').text();
   }

   newPriceValue = newPriceValue.replace( /,/,"." );

   var position1 = newPriceValue.indexOf("(");
   var position2 = newPriceValue.indexOf(")");
   position1 = position1+2;

   var finalPriceValue = newPriceValue.substring(position1, position2);
   if(newPriceValue.indexOf('.') == -1)
   {
    finalPriceValue = "0";
   }
   else
   {
    finalPriceValue = finalPriceValue.substring(0,finalPriceValue.length - 1);
   }
   console.log(finalPriceValue);

   finalPriceValue = parseFloat(finalPriceValue) + parseFloat(OriginalPrice);
   finalPriceValue = finalPriceValue.toFixed(2);
   finalPriceValue = finalPriceValue.replace( ".","," );

   $('#priceUpdate').text(finalPriceValue + OriginalCurrency);
   });
});

价格以欧元计算,因此它将其转换为正确的十进制值并返回。

希望它清楚,有人可以提供帮助!

干杯!

3 个答案:

答案 0 :(得分:0)

假设您的代码的其他部分正在按预期执行(因为我看不到您的html示例)。还要假设所有的无线电标签和选择标签都添加了class =“option”。

目前您正在检查是否已选中或选中每个.option,但只有在可能有多个值时才会获得一个值。

function get_final_price_value(newPriceValue)
{
  newPriceValue = newPriceValue.replace( /,/,"." );

   var position1 = newPriceValue.indexOf("(");
   var position2 = newPriceValue.indexOf(")");
   position1 = position1+2;

   var finalPriceValue = newPriceValue.substring(position1, position2);
   if(newPriceValue.indexOf('.') == -1)
   {
    finalPriceValue = "0";
   }
   else
   {
    finalPriceValue = finalPriceValue.substring(0,finalPriceValue.length - 1);
   }

  return parseFloat(finalPriceValue)
}

var runningTotalUpdatedPrice = parseFloat(OriginalPrice);

$('.option :checked').each(function(index) {
    var newPriceValue = $(this).attr("id");
    newPriceValue = $("label[for='" + newPriceValue + "']").text();
    var finalPriceValue = get_final_price_value(newPriceValue);
    runningTotalUpdatedPrice = runningTotalUpdatedPrice + finalPriceValue;
});
$('.option :selected').each(function(index) {
    var newPriceValue = $(this).text();
    var finalPriceValue = get_final_price_value(newPriceValue);
    runningTotalUpdatedPrice = runningTotalUpdatedPrice + finalPriceValue;
});

runningTotalUpdatedPrice = runningTotalUpdatedPrice.toFixed(2);
runningTotalUpdatedPrice = runningTotalUpdatedPrice.replace( ".","," );

$('#priceUpdate').text(runningTotalUpdatedPrice + OriginalCurrency);

答案 1 :(得分:0)

<script type="text/javascript">
function get_final_price_value(newPriceValue)
{

var position1 = newPriceValue.indexOf("(");
var position2 = newPriceValue.indexOf(")");

position1 = position1+2;

var finalPriceValue = newPriceValue.substring(position1, position2);

if(newPriceValue.indexOf('.') == -1)
{
 finalPriceValue = "0";

}
else
{
 finalPriceValue = finalPriceValue.substring(1,finalPriceValue.length - 1 );
}


 return finalPriceValue;
}

$(document).ready(function() {
$('.option').live('change',function() {
var OriginalPrice = $('#thisIsOriginal').text();
var OriginalCurrency = OriginalPrice.substring(0, 1);
OriginalPrice = OriginalPrice.substring(1);

var runningTotalUpdatedPrice = parseFloat(OriginalPrice);


$('.option :selected').each(function(index) {
    var newPriceValue = $(this).text();

    var finalPriceValue = get_final_price_value(newPriceValue);


    runningTotalUpdatedPrice = runningTotalUpdatedPrice +     parseFloat(finalPriceValue);
        });

 runningTotalUpdatedPrice = runningTotalUpdatedPrice.toFixed(2);

 $('#priceUpdate').text(OriginalCurrency + runningTotalUpdatedPrice  );

    }); 
 });
 </script>

仅适用于英国

答案 2 :(得分:0)

以下是我用来获得期权价格变动的代码。 此外,还可以选择更改产品图片。

$(document).ready(function() {

//total value
var total = 0;

//get the original price and convert to decimal (Euro prices)
var OriginalPrice = $('#thisIsOriginal').text();
OriginalPrice = OriginalPrice.replace( /,/,"." );

//get the currency (in Euro placed at the end of the string)
var OriginalCurrency = OriginalPrice.substring(OriginalPrice.length - 1, OriginalPrice.length);
OriginalPrice = OriginalPrice.substring(0,OriginalPrice.length - 1);

function calcTotal() {
    $("input:checked").each(function() {
        var value1 = $(this).attr("id");
        value1 = $("label[for='" + value1 + "']").text();
        value1 = value1.replace( /,/,"." );

        var position11 = value1.indexOf("(");
        var position12 = value1.indexOf(")");
        position11 = position11+2;

        var newPrice1 = value1.substring(position11, position12);
        if(value1.indexOf('.') == -1) {
            newPrice1 = "0";
        }
        else {
            newPrice1 = newPrice1.substring(0,newPrice1.length - 1);
        }

        total += parseFloat(newPrice1);
    });

    $("select option:selected").each(function() {
        var value2 = $(this).text();
        value2 = value2.replace( /,/,"." );

        var position21 = value2.indexOf("(");
        var position22 = value2.indexOf(")");
        position21 = position21+2;

        var newPrice2 = value2.substring(position21, position22);
        if(value2.indexOf('.') == -1) {
            newPrice2 = "0";
        }
        else {
            newPrice2 = newPrice2.substring(0,newPrice2.length - 1);
        }

        total += parseFloat(newPrice2);
    });
}

function imageUpdate( getoptionId ) {
    var value3 = $("label[for='option-value-" + getoptionId + "']").children("img").attr("src");

    var fileNameIndex = value3.lastIndexOf("/") + 1;
    var fileName = value3.substr(fileNameIndex);

    var fileTypeStart = fileName.indexOf("50x50");
    var fileTypeEnd = fileName.indexOf("50x50")+5;
    var fileType = fileName.substring(fileTypeEnd,fileName.length);

    var plainFileName = fileName.substring(0,fileTypeStart-1);

    var fullPath = value3.indexOf(fileName);
    fullPath = value3.substring(0,fullPath);

    var newPath = fullPath.replace("cache/","");

    var newFile = newPath + plainFileName + fileType;

    $("#imageUpdate > img").attr("src",newFile);
    $("#imageUpdate > img").attr({ width: '228px', height: '228px' });
}

$('.option').change(function() {
    total = 0;
    calcTotal();

    //add the collected changed prices on top of the original price
    total = parseFloat(total) + parseFloat(OriginalPrice);
    total = total.toFixed(2);
    total = total.replace( ".","," );

    //update the price value into the related div
    $('#priceUpdate').text('<span class="price-currency">' + OriginalCurrency + '</span> ' + total);

    var optionId = $(this).find("input:checked").val();
    imageUpdate(optionId);
});

});

希望这有帮助!