Question

所描述的问题仅发生在FF和Chrome浏览器中，IE和Safari等其他浏览器工作正常。 Opera曾经也很好用，但现在已经没有了，就像我几分钟前测试过的那样！

我正在使用商店系统 xtcModified-Version 1.06 和一些模块，比如tabbing-module和price-updater-module。

以下是价格更新程序的代码，我认为问题在于：

var attributePriceUpdater;
(function ($) {
    // BEGIN: attributePriceUpdater
    attributePriceUpdater = {
        // BEGIN: calculate
        calculate: function (This) {
            var newPrice = 0;
            var summe = 0;
            var symbolLeft = '';
            var symbolRight = '';
            var data = This.data('attrdata');

            if ($('#optionen' + data.pid + ' select').length) {
                var el = ' option:selected'; //wenn selectfeld
            } else {
                var el = ' input:checked'; //wenn checkbox oder radio
            }

            $.each($('#optionen' + data.pid + el), function (index, item) {
                if (!$(this).parents('#optionen' + data.pid + ' [id^="pmatrix_v"]').attr('style')) {
                    data = $(this).data('attrdata');
                    if (data.aprice != 0) {
                        if (data.prefix == '-') {
                            summe -= data.aprice;
                        } else if (data.prefix == '+') {
                            summe += data.aprice;
                        } else if (data.prefix == '=') {
                            summe += data.aprice - data.gprice;
                        }
                    }
                }
            });

            newPrice = (summe + data.gprice).toFixed(2).toString().replace(/[.]/, ',');
            if (data.cleft) {
                symbolLeft = data.cleft + '&nbsp;';
            }
            if (data.cright) {
                symbolRight = '&nbsp;' + data.cright;
            }

            // html schreiben
            $('#optionen' + data.pid + ' .calculatePrice span.cuPrice').html(data.vpe + '&nbsp;' + symbolLeft + newPrice + symbolRight);
            $('div.product_price').html(symbolLeft + newPrice + symbolRight);
            // html schreiben
        },
        // END: calculate

        // BEGIN: calculateAll
        calculateAll: function () {
            $.each($('div[id^="optionen"] input[type=radio]:checked, div[id^="optionen"] input[type=checkbox], div[id^="optionen"] option'), function (index, item) {
                attributePriceUpdater.calculate($(this));
            });
        }
        // END: calculateAll
    };
    // END: attributePriceUpdater

    // BEGIN: $(document).ready
    $(document).ready(function () {
        attributePriceUpdater.calculateAll();
        $(".javascriptOff").css({
            display: "block"
        });

        $('#tabbed_product_info2 a[href]').on("click", function () {
            $('.cuPrice').css('background', 'red');
        });

        $('div[id^="optionen"] select').click(function () {
            attributePriceUpdater.calculate($('option', this));
        });

        $('div[id^="optionen"] input').click(function () {
            attributePriceUpdater.calculate($(this));
        });
    });
    // END: $(document).ready
})(jQuery);

我已经在 js-fiddle 中提出了我的问题...它“有效”并显示我遇到的问题，但布局错误。但这不会对问题造成伤害......

http://jsfiddle.net/t2UW5/1/

通常，不同尺寸应排列在标签中，在此示例中，它们会一个接一个地显示。

现在问题：

该商品的基本价格为2,80欧元。

我选择了第一个选项，价格为4,20欧元。现在我向下滚动到最后，显示正确的价格。现在我选择最后一个选项“160 x 90 cm”，价格会更新。但是没有正确的72,00欧元的价格，它显示73,40欧元。

首先，我以4,20欧元的价格选择了该选项。这减去2,80欧元的基本价格等于1,40欧元。这是价格显示的价值，包括新价格（72,00欧元+ 1,40欧元= 73,40欧元）。

当我再次点击同一选项时，价格会以72欧元正确显示。

每当我在另一个标签中点击另一个价格时就会发生同样的事情，这在我之前描述的这个例子中是看不到的。

另一个例子：首先选择第一个选项（4,20 EUR），然后选择第四个选项“118.9 x 84.1 cm”，收费为60,00 EUR。更新后的价格显示为61,40欧元，因此再次显示基本价格与首选选项之间的差异......

这个绝对奇怪的是问题只发生在Firefox，Opera和Chrome浏览器中！我在IE和Safari中测试了相同的网站和js-fiddle，它工作得很好！

我很感激这方面的任何帮助！ Thx提前！

Answer 1

试试这个JS FIDDLE。基本上，在点击事件中，单选按钮都被取消选择，然后选择单击的按钮。

http://jsfiddle.net/t2UW5/4/

$('div[id^="optionen"] input').on("click", function() {
    $(':radio').prop('checked', false);
    $(this).prop('checked', true);
    console.log('clicked an input');
    attributePriceUpdater.calculate($(this));
});

价格更新程序在FF，Opera和Chrome中无法正常工作

1 个答案: