Question

这是我的代码：

 $(document).ready(function () {
        $("#afiseaza_subtotal").click(function(){
            var i = 0; var list = []; 
            $(".name1").each(function(){
                list[i] =  $(this).val();
                i++;
            });
            var uniqueNames = [];
            $.each(list, function(i, el){
                if (el !=""){
                    if($.inArray(el, uniqueNames) === -1) uniqueNames.push(el);
                }
            });
            var html = "";
            if (uniqueNames.length > 0){
                $.each(uniqueNames, function(i, value){
                    var sum = 0;
                    if ($(".name1").attr("value") == value ){
                       // sum = parseFloat($(this).parent(".prod-persoana1").prev(".prod-pret1").find(".price").text());
                    }
                    //

                    html += "<p>Subtotal "+value+"-"+ sum +" lei </p>";

                });
                // initial_html = $(".subtotal").html();
                $(".subtotal").append(html);
            }else{
                alert("dasdasd");
            }
        });

    });

在数组uniqueNames中，我拥有所有DISTINCT输入值。我也是另一个项目，它是总和。我希望从相同的输入中获取所有 sum 值。请参阅以下示例：

 12$    Name1
 13.4$  Name2
 14$    Name1
 14$    Name3

结果将是一个小计，如下所示：

26$    Name1
13.4$  Name2
14$    Name3

正如我在uniuqNames数组中所说，我得到了唯一的名字。现在我需要得到这笔钱。我如何得到这笔款项？

这是html代码：

<div class="prod-pret1">
    <span class="price bolder">6.8 </span> Lei
</div>
<div class="prod-persoana1">
    <input name="nume1" type="text" id="nume1" class ="name1" value="" placeholder="Nume">
</div>
<div class="prod-pret1">
    <span class="price bolder">6.8 </span> Lei
</div>
<div class="prod-persoana1">
    <input name="nume2" type="text" id="nume2" class ="name1" value="" placeholder="Nume">
</div>
.....

Answer 1

你过于复杂：

$('button').on('click',function(){
    var subtotal = {};
    $('input').each(function(){
       var $this = $(this);
        var cls = this.className;
        if(subtotal[cls] === undefined){
             subtotal[cls] = parseFloat($this.val());   
        }
        else{
             subtotal[cls] += parseFloat($this.val());   
        }
    });
    
    console.log(subtotal);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input name="nume1" type="text" id="nume1" class ="name1" value="12" placeholder="Nume">
<input name="nume2" type="text" id="nume2" class ="name2" value="13.4" placeholder="Nume">
<input name="nume2" type="text" id="nume2" class ="name1" value="14" placeholder="Nume">
<input name="nume3" type="text" id="nume3" class ="name3" value="14" placeholder="Nume">    
<button>Calculate subtotal</button>

输出（到控制台）：

对象{name1 = 26，name2 = 13.4，name3 = 14}

Answer 2

嗯，当您将唯一名称推送到数组中时，这很容易实现。

 if($.inArray(el, uniqueNames) === -1) uniqueNames.push(el);

实际应该运行与此类似的另一个代码块：

var subTotals = {};
if($.inArray(el, uniqueNames) === -1) {

   $.each ( ELEMENTS_WITH_PRICES_FOR_CURRENT_NAME , function () {
      subTotals[el] += parseFloat($(this).parent(".prod-persoana"+el).prev(".prod-pret"+ el).find(".price").text())
   });

   uniqueNames.push(el);

}

subTotals[ el ]正在增加"formula"获取真正奇怪的价格。你应该真正采用其他HTML结构。我真的不明白。但这个想法很相似。

Answer 3

$(document).ready(function () {
    $("#afiseaza_subtotal").click(function(){
        //Contains all the classes of the inputs and sum of their values
        var uniquenames = [];
        $('input[type="text"]').each(function(){
             /*First time seeing this class, set value and key in array.*/
             if(uniquenames[$(this).class()] === "undefined")
             {
                 uniquenames[$(this).class()] = parseInt($(this).val());
             }
             else
             {
                 /*Add value in array*/
                 uniquenames[$(this).class()] += parseInt($(this).val());
             }
        });
        /*Use the uniquenames array in anyway you want :) The key = class; value = sum*/
    });
});

Answer 4

此版本适用于我：

$(document).ready(function () {
        $("#afiseaza_subtotal").click(function(){
            $(".new_subtotal").each(function(){
                $(this).remove();
            });
            var i = 0; var list = []; 
            $(".name1").each(function(){
                list[i] =  $(this).val();
                i++;
            });
            var uniqueNames = [];
            $.each(list, function(i, el){
                if (el !=""){
                    if($.inArray(el, uniqueNames) === -1) uniqueNames.push(el);
                }
            });
            var html = "";
            if (uniqueNames.length > 0){
                $.each(uniqueNames, function(i, value){
                    var sum = 0;
                    $(".prod-pret1").each(function(){
                            initial_sum = parseFloat($(this).find(".price").text());

                            compare_value = $(this).next(".prod-persoana1").find(".name1").attr("value");
                            if (compare_value == value){
                                sum = sum + initial_sum;
                            }
                    });
                    html += "<p class='new_subtotal'>Subtotal "+value+"-"+ sum +" lei </p>";

                });
                // initial_html = $(".subtotal").html();
                $(".subtotal").append(html);
            }else{
                alert("dasdasd");
            }
        });

    });

Answer 5

试试这个

     $(document).ready(function () {
        $("#add").click(function () {
            var data = {};
            $("input[type='text']").each(function () {
                if (data[this.className] == undefined) {
                    data[this.className] = $("." + this.className).sum();
                }
            });
            $("#result").html(JSON.stringify(data, null, 4));
        });
    });

    (function ($) {
        $.fn.sum = function () {
            var s = 0.00;
            $(this).each(function () {
                s += Number($(this).val());
            });
            return s;
        };
    })(jQuery);

HTML：

<div>
    <input type="text" id="txt1" class="name1" value="14" />
    <input type="text" id="txt2" class="name1" value="14" />
    <input type="text" id="txt3" class="name2" value="14" />
    <input type="text" id="txt4" class="name3" value="14" />
</div>
<input type="submit" id="add" value="Calculate" />
<div id="result">
</div>

输出：

{ "name1": 28, "name2": 14, "name3": 14 }

如何在jQuery中使用类名获取所有输入值？

5 个答案: