0

このコードでは、フォームに基づいていくつかの値を加算し、最小値を減算して新しい合計を作成します。コードはうまく機能します。私がやりたいのは、一番下に新しい合計だけを表示するのではなく、3. 減算なしの元の合計、減算した最低価格の値、そして最後に実際の合計を表示することです。新しい合計。現在のところ、新しい合計のみが表示されています。

例: スカーフが $5、帽子が $10、ジャケットが $20 の 3 つのアイテムがあります。$35 に等しいすべての値を追加し、次に $5 のスカーフである最低値を差し引いて、新しい合計 $30 を取得します。これを一番下に表示したい。

合計: $35 割引: $-5 新規 合計: $30

関数はすでにこれらすべての値を把握していますが、関数からそれらを呼び出す方法がわかりません。

// All selected prices are stored on a array
var prices = [];

// A function to remove a item from an array
function remove(array, item) {
    for (var i = 0, len = array.length; i < len; i++) {
        if (array[i] == item) {
            array.splice(i, 1);
            return true;
        }
    }
    return false;
}

function calculateSectedDues(checkbox, amount) {
    // We add or remove the price as necesary

if (checkbox.checked) {
    prices.push(amount);
} else {
    remove(prices, amount);
}

// We sum all the prices
var total = 0;
for (var i = 0, len = prices.length; i < len; i++)
    total += prices[i];

// We get the lower one
var min = Math.min.apply(Math, prices);


if(min == Infinity) { min = 0; };

// And substract it
total -= min;

document.grad_enroll_form.total.value = total;

}

4

2 に答える 2

1

値を書き出すだけの基本的なコードを次に示します。配列から要素を削除するためのループにはまだ同意しません。

<span id="value"></span>

var prices = [];

function remove(arr,itm){
    var indx = arr.indexOf(itm);
    if (indx !== -1){
        arr.splice(indx,1);
    }
}

function calculateSectedDues(checkbox, amount) {
    if (checkbox.checked === true) {
        prices.push(amount);
    } else {
        remove(prices, amount);
    }

    var total = 0;
    for (var i = 0, len = prices.length; i < len; i++)
        total += prices[i];

    var min = prices.slice().sort(function(a,b){return a-b})[0];
    if(typeof min === 'undefined') min = 0;

    var withDiscount = total - min;
    var discountAmount = withDiscount - total;
    
    document.querySelector("#value").innerHTML = "Total: $"+total+'<br>';
    document.querySelector("#value").innerHTML += "Discount: $"+discountAmount+'<br>';
    document.querySelector("#value").innerHTML += "New total: $"+withDiscount+'<br>';
}

次のように実行します。

calculateSectedDues({checked:true},10);
calculateSectedDues({checked:true},20);
calculateSectedDues({checked:true},5);

次の出力が得られます。

合計: $35
割引: $-5
新しい合計: $30

JSFiddle

チェックボックスの使用

<label><input type="checkbox" onclick="calculateSectedDues(this,5)" name="Scarf"> <span>Scarf</span><label><br>
<label><input type="checkbox" onclick="calculateSectedDues(this,10)" name="Hat"> <span>Hat</span><label><br>
<label><input type="checkbox" onclick="calculateSectedDues(this,20)" name="Jacket"> <span>Jacket</span><label><br>

<span id="value">Total: $0<br>Discount: $0<br>New total: $0</span>
于 2013-04-18T18:04:55.177 に答える
-1

HTML がどのように見えるかはわかりませんが、このようなものが機能します。jQuery を使用して、チェックされているすべてのチェックボックスを取得し、それらのチェックボックスの値を合計に追加して、最小値を追跡します。次に、3 つの値すべてを 1 つのオブジェクトで返します。

チェックボックスの値が商品の価格であると想定していますが、そうではない可能性があります。そうでない場合でも、アイデアは機能します。正しい価格を得るには、さらに作業を行う必要があります。

function calculate() {
    var total = 0, 
        discount = 0
    ;

    $('input[type="checkbox"]:checked').each(function() {
        var val = parseFloat($(this).val());

        if(discount === 0 || val < discount) {
            discount = val; // keep track of minimum
        }

        total += val;
    });

    //return all three values in one object
    return {
        total: total,
        discount: disount,
        discountedPrice: (total - discount)
    }
}
于 2013-04-18T18:24:15.370 に答える