0

いくつかの製品の数量*単価+税金と小計、そして合計を計算するためのシンプルで基本的なjquery関数があります。リストボックスでのユーザーの選択に基づいて、jqueryを使用して、さまざまな税率の税のインポートをリアルタイムで表示したいと思います。2つの製品の基本的な方法を見つけましたが、3つ以上の場合、私の方法は機能しません。助けてください。;）

これは私のコードです：デモは[ここ] http://jsfiddle.net/skipperit/px9tb/8/

<script type='text/javascript'> 
$(function(){
$('#q1,#pu1,#tax1,#tax2,#q2,#pu2').change(function() {
var q1 = parseFloat($('#q1').val(), 10);
var qval1 = 0;
if (q1 > 0) {
    qval1 = q1;
}
var q2 = parseFloat($('#q2').val(), 10);
var qval2 = 0;
if (q2 > 0) {
    qval2 = q2;
}


var pu1 = parseFloat($('#pu1').val(), 10);
var puval1 = 0;
if (pu1 > 0) {
    puval1 = pu1;
}

var pu2 = parseFloat($('#pu2').val(), 10);

var puval2 = 0;
if (pu2 > 0) {
    puval2 = pu2;
}

var subtot1 = 0;
subtot1 =  parseFloat(qval1 * puval1);
var subtot2 = 0;
subtot2 =  parseFloat(qval2 * puval2);
var subtot = 0;
subtot = subtot1 + subtot2;
var tax1 = parseFloat($('#tax1').val(), 10);
var tax2 = parseFloat($('#tax2').val(), 10);
var ivaprice1 = 0;
var ivaprice2 = 0;
if (tax1 > 0) {

    ivaprice1 = subtot1 * tax1 / 100;
}
if (tax2 > 0) {

    ivaprice2 = subtot2 * tax2 / 100;
}
 var ivaprice = 0;
 ivaprice = parseFloat(ivaprice1 + ivaprice2);
var ivatext = "";
ivatext = "tax ";

$('#total').html(parseFloat(subtot + ivaprice).toFixed(2));
$('#tasse').html(parseFloat(ivaprice).toFixed(2));
$('#imp').html(parseFloat(subtot).toFixed(2));
$('#subtot1b').html(parseFloat(subtot1).toFixed(2));
$('#subtot2b').html(parseFloat(subtot2).toFixed(2));

if (tax2 == tax1) {
    $('#taxw').html(parseInt(tax1));
    $('#taxtxt2').html('');
    $('#taxw2').html('');
    $('#taxv').html(parseFloat(ivaprice).toFixed(2));
    $('#taxv2').html('');
    $('#taxtxt2b').html('');
}
else
{
    $('#taxw').html(parseInt(tax1));
    $('#taxw2').html(parseInt(tax2));
    $('#taxtxt2').html('tax');
    $('#taxtxt2b').html('%:');
    $('#taxv').html(parseFloat(ivaprice1).toFixed(2));
    $('#taxv2').html(parseFloat(ivaprice2).toFixed(2));
 }

});
});  

</script>


</head>
<body>
<p>q1 : 
<input id="q1" value="0"/>

pu1 :
<input id="pu1" value="0"/> 
tax1:
<select name="tax1" id="tax1">
<option value="4">4</option>
<option value="21">21</option>
<option value="16">16</option>
</select>
</p>
<p>q2 :
<input id="q2" value="0"/>
pu2 :
<input id="pu2" value="0"/>
tax2 :
 <select name="tax2" id="tax2">
<option value="4">4</option>
<option value="21">21</option>
<option value="16">16</option>
 </select>
 <br>
<br>subtot1: <span id="subtot1b"></span><br>
 subtot2: <span id="subtot2b"></span><br>
tax <span id="taxw"></span>%: <span id="taxv"></span><br>
<span id="taxtxt2"></span> <span id="taxw2"></span><span id="taxtxt2b"></span>    <span    id="taxv2"></span><br>

 taxable: €&lt;span id="imp"></span><br>
 Tax: €&lt;span id="tasse"></span><br>
 Total price : €&lt;span id="total"></span></p>
</body>
4

2 に答える 2

0

これは完全な答えではありません。私が理解できない変数名が多すぎて、そこで起こっていることが多すぎるからです。うまくいけば、それはいくつかの有用性があるでしょう。

ステップ1：変更されたときに再計算をトリガーするクラスを任意のフィールドに追加します。これにより、それらすべてに対して単一のjQueryセレクターを作成できます。例：

<input id="q1" value="0" class="change-trigger" />

と

$('.change-trigger').change(function() { ... });

ステップ2：変更時に​​すべてを再計算する必要があるように思われるので、関連するフィールドからオブジェクトに値を読み取り、オブジェクトを配列に格納してみてください（上記のハンドラー関数内）。

var allValues = [];
$('.change-trigger').each(function(idx) // do something with all .change-trigger elements
{
    var values = {};
    values.q = Math.max(0, parseFloat($('#q' + idx).val(), 10));
    values.pu = Math.max(0, parseFloat($('#pu' + idx).val(), 10));
    values.tax = Math.max(0, parseFloat($('#tax' + idx).val(), 10));
    values.pretaxtotal = values.q * values.pu;
    values.taxtotal = (values.pretaxtotal * values.tax) / 100;
    values.linetotal = values.pretaxtotal + values.taxtotal;

    allValues[idx] = values;
}

// later calculations using a loop over the allValues array, e.g.
var taxBandTotals = [], lowTax = 100.0, highTax = 0.0, taxIndex;
for (var i = 0; i < allValues.length; i+=1)
{
    // sum up each tax band by adding to index [tax%] in array
    if (allValues[i].tax > 0)
    {
        lowTax = Math.min(lowTax, allValues[i].tax);
        highTax = Math.max(highTax, allValues[i].tax);
        taxIndex = parseInt(allValues[i].tax, 10);

        // initialise to 0

        if (taxBandTotals[taxIndex] === undefined)
        { taxBandTotals[taxIndex] = 0; }

        // add this entry's tax to the right slot
        taxBandTotals[taxIndex] += allValues[i].taxtotal;

    }

    // aggregate values into totals etc.
    // could play with loop variable to look ahead/behind for
    // comparison with other tax values?
}

for (var j = parseInt(lowTax, 10); j <= parseInt(highTax, 10); j+=1)
{
    if (taxBandTotals[j] !== undefined)
    {
        // this is a total for tax % "j"
    }
}

ステップ3：ものを削除します。CDATAもう必要ありません:)

于 2012-07-27T17:04:37.840 に答える
0

デモはこちら

html：

​&lt;div id="uguu" data-row="5"></div>​​​​​​​​​​​​​​​​​​​​​​​​

js：

$(function() {
    (function($) {
        $.fn.extend({
            autobotTransform: function() {
                return this.each(function() {
                    // variables
                    var _this = $(this);
                    var prodCount = _this.attr("data-row");
                    var _opt = '<option value="4">4</option><option value="21">21</option><option value="16">16</option>';

                    // set-up
                    for (i = 1; i <= prodCount; i++) {
                        _this.append('<p class="priceRow">q' + i + ' :<input id="q' + i + '" value="0" />' +
                                     'pu' + i + ' :<input id="pu' + i + '" value="0" />' +
                                     'tax' + i + ':<select name="tax' + i + '" id="tax' + i + '">' +
                                     _opt + '</select>'
                                    );
                    }
                    for (i = 1; i <= prodCount; i++) {
                        _this.append('subtot' + i + ': <span id="subtot' + i +'"></span> ' +
                                     'tax <span id="taxw' + i + '"></span>%: <span id="taxv' +
                                     i + '"></span><br>'
                                    );
                    }
                    $("input, select", _this).on("change", function() {
                        $('p.priceRow').each(function(index) {
                            var __this = $(this);
                            var i = index + 1;
                            $("#subtot" + i).html(
                                ((($("#q" + i).val() > 0) ? parseFloat($("#q" + i).val(), 10) : 0.00)
                                * (($("#pu" + i).val() > 0) ? parseFloat($("#pu" + i).val(), 10) : 0.00)).toFixed(2)
                            );
                            $("#taxw" + i).html($("#tax" + i).val());
                            $("#taxv" + i).html(($("#subtot" + i).html() * $("#tax" + i).val() * 0.01).toFixed(2));
                        });
                    }).trigger("change");
                });
            }
        });
    })(jQuery);

    $("#uguu").autobotTransform();​
});
于 2012-07-27T18:20:13.747 に答える