Question

我在文本框中动态显示了价格和数量的产品清单，我想在输入数量时计算产品总价。我有完成这个 onclick 当增加或减少按钮时。但我还需要计算按键数量文本框时的总价格

我的代码就像

<div id="gw_articles">
    <div id="article_list">
        <p>
            <div id="article_1_element">
                <input type="text" id="jform_article_1_name" name="jform[article_1][name] " value="Spark plug ARH-II AIW16 IRIDIUM+" disabled="disabled" size="35" /> <a id="jform_article_1_modal">Select an product</a>

                <input type="hidden" id="jform_article_1_id" name="jform[article_1][id]" value="2" />
                <input type="hidden" name="jform[article_1][price]" id="jform_article_1_price" value="30.00" class="inputbox" />
                <input type="text" name="jform[article_1][price_total]" id="jform_article_1_price_total" value="90" class="inputbox" size="10" />
                <input type="text" name="jform[article_1][quantity]" id="jform_article_1_quantity" value="3" class="inputbox" size="10" />
                <input type="button" class="btn" value="+" onclick="document.id('jform_article_1_quantity').value++; calculateTotalPrice('jform_article_1')" />
                <input type="button" class="btn" value="-" onclick="if(document.id('jform_article_1_quantity').value >1)document.id('jform_article_1_quantity').value--; calculateTotalPrice('jform_article_1')" /> 
                <a title="test" class="btn btn-danger" onclick="removeElement('article_1_element')"> Delete </a>
            </div>
        </p>
        <p>
            <div id="article_2_element">
                <input type="text" id="jform_article_2_name" name="jform[article_2][name] " value="Spark plug ARH-II AIW20 IRIDIUM+" disabled="disabled" size="35" /> <a id="jform_article_2_modal" class="btn modal" title="Select an product">Select an product</a>

                <input type="hidden" id="jform_article_2_id" name="jform[article_2][id]" value="1" />
                <input type="hidden" name="jform[article_2][price]" id="jform_article_2_price" value="40.00" class="inputbox" />
                <input type="text" name="jform[article_2][price_total]" id="jform_article_2_price_total" value="40" class="inputbox" size="10" />
                <input type="text" name="jform[article_2][quantity]" id="jform_article_2_quantity" value="1" class="inputbox" size="10" />
                <input type="button" class="btn" value="+" onclick="document.id('jform_article_2_quantity').value++; calculateTotalPrice('jform_article_2')" />
                <input type="button" class="btn" value="-" onclick="if(document.id('jform_article_2_quantity').value >1)document.id('jform_article_2_quantity').value--; calculateTotalPrice('jform_article_2')" /> 
                <a title="test" class="btn btn-danger" onclick="removeElement('article_2_element')"> Delete </a>
            </div>
        </p>
    </div>
    <input type="hidden" id="articles_max" name="articles_max" value="2" />
</div>

Answer 1

这段代码的优点还在继续。试试这个：

function calculateTotalPrice(article) {
    var price = and * multiplication - (some + addition);
    $('#jform_article_2_total_price').val(price);
}
$('#jform_article_2_quantity').focusout(function(){
    calculateTotalPrice('jform_article_2');
});

Answer 2

我通过

解决了这个问题

      `jQuery(document).ready(function($) {
       jQuery("input[id*='quantity']" ).focusout(function(){
    max_value = $("#articles_max").val();
    var n =1;
        jQuery("input[id*='quantity']" ).each(function(){
    if (n <= max_value) {
    id='jform_article_'+n;
    calculateTotalPrice(id);
   n++;
   }
    })     
    })  
     });
    function calculateTotalPrice(field){

            var price = document.id(field + "_price").value;
            var quantity = document.id(field + "_quantity").value;
            document.id(field + "_price_total").value = price * quantity; 
        }`

使用jquery / javascript触发keyup时获取动态id

2 个答案: