0

私はeコマースサイトを持っています。主な製品のさまざまなバリエーションやアドオンを入手できる製品ページがあります。顧客がオプションをクリックしたときに動的に価格を表示できるようにしたいと思います。

基本的なhtmlは次のようになります。

<div class="addons">
    <input type="radio" name="products[39][addons][Handles]" title="Handles" value="579" alt="7.00" class="options"> Bronze Left
    <input type="radio" name="products[39][addons][Handles]" title="Handles" value="580" alt="8.00" class="options"> Bronze Right
    <input type="radio" name="products[39][addons][Handles]" title="Handles" value="581" alt="9.00" class="options"> Chrome Left
    <input type="radio" name="products[39][addons][Handles]" title="Handles" value="582" alt="10.00" class="options"> Chrome Right  

    <input type="radio" name="products[39][addons][Glass]" title="Glass" value="589" alt="18.00" class="options"> Brass Clarity
    <input type="radio" name="products[39][addons][Glass]" title="Glass" value="590" alt="20.00" class="options"> Zinc Abstract
    <input type="radio" name="products[39][addons][Glass]" title="Glass" value="591" alt="21.00" class="options"> Zinc Elegance
    <input type="radio" name="products[39][addons][Glass]" title="Glass" value="592" alt="23.00" class="options"> Zinc Prairie  
</div>

Value属性はカートへの追加機能に使用されますが、これを変更することはできません。価格はaltとして設定されますが、明らかに何でもかまいません。タイトルはjQueryクリックターゲットに設定されます。

jQueryのサポートが必要です。私が抱えている問題は、クリック関数の外でvar価格を互いに加算する方法がわからないことです。

$("input[type='radio'][title='Handles']").click(function() {
    price = $(this).val();
}

$("input[type='radio'][title='Glass']").click(function() {
    price = $(this).val();
}
4

4 に答える 4

1

input[type='radio']:checked探している要素をフィルタリングして取得するために使用できます。

var total = 0;

// Get all the input tags that are checked.
$(".addons").find("input[type='radio']:checked").each(function() {
    total += parseFloat($(this).attr('alt'));
});
于 2012-05-06T02:40:48.383 に答える
1

私が理解しているのであれば、altに値を追加したいだけです。あなたは次のようにそれを行うことができます：

var total = 0;
$(".addons").find("input:checked").each(function() {
    total += parseFloat($(this).attr('alt'));
});

このコードをクリックハンドラーで実行し、合計を表示するHTMLを更新します。

EDIT "input：checked"は "input [checked=checked]"よりもクリーンです。

于 2012-05-06T02:36:49.830 に答える
0

私がこれを正しく理解しているなら、あなたは選択された各オプションの価格を合計したいと思うでしょう。これを行う1つの方法は次のとおりです。

// An object to keep track of the total amount of each title
var total = {};

// Change event on the radio buttons
$('input[type=radio]').change(function() {
    // Assign the alt to the total object with the key name being the title
    total[$(this).attr('title')] = parseFloat($(this).attr('alt')).toFixed(2);

    // Output the result to HTML (optional)
    outputTotal();
});

function outputTotal()
{
    // Here all the prices are being summed
    var sum = 0;

    for(var index in total)
    {
        sum += total[index];
    }

    // And output to HTML
    $('.total').html(sum);
}

jsFiddleの例

于 2012-05-06T02:46:16.020 に答える
0 
var inputs = $(".addons input.options");
inputs.click(function() {
    var total = 0;
    $(".addons").find(":checked").each(function(){
       total += parseFloat($(this).attr("alt"));
    });
    $("#total").val(total);
});

http://jsfiddle.net/tive/fyZbV/

于 2012-05-06T03:14:02.277 に答える