Question

我正在尝试使用jquery创建一个函数，我想在我定义input值的页面中获取attibute的总数。例如，有四个输入标签

<input type="hidden" class="code" barcode="567" total_quantity="3" name="product1" value="Nokia rita" class="product-10105">
<input type="hidden" class="code" barcode="567" total_quantity="3" name="product1" value="Nokia rita" class="product-10105">
<input type="hidden" class="code" barcode="567" total_quantity="3" name="product1" value="Nokia rita" class="product-10105">
<input type="hidden" class="code" barcode="200" total_quantity="3" name="product1" value="book" class="product-200">

在上面的标签中，我想在变量中预先定义条形码编号，并相应地计算输入数量，并在我提供的条形码编号的变量中得到total_quantity的值。我做了以下代码来获取总输入，但它用于所有输入，而不是根据我将指定的条形码。

var barcode_pd = $('input[barcode]').size();
var total_pd = $('input.code').attr("total_quantity");
var sumOfVals = 0;
$(".mn-no-cnt").each(function(){sumOfVals = sumOfVals + parseInt($(this).val(), 10);});

使用上面的代码，输入计数的输出为4，我也要指定条形码编号，例如567，以便计数可以是3或者如果我使用条形码号码200然后计数为1。

Answer 1

我使用数组来存储值。

var code = [];
var count = [];
$("input.code").each(function(){
    var c = $(this).attr("barcode");    
    if(code.indexOf(c) >= 0){
        count[code.indexOf(c)] += 1;
    }
    else{
        code.push(c);
        count.push(1);
    }
});
for(var i=0;i<code.length;i++){
    $("body").append("<p>Barcode:"+code[i]+" Count:"+count[i]+"</p>");
}

DEMO here.

Answer 2

http://jsfiddle.net/A95Js/

function countBarcode(numberToFind){
    var countInputs = 0;

    $('input[barcode]').each(function(){
        if($(this).attr("barcode") == numberToFind){
            countInputs ++;
    }

        return countInputs;

});

}

$('#answer').html(countBarcode(567));

这纯粹是为了计算它们 - 但结合Hirals答案，你应该能够弄清楚如何将他变成一个功能。 JSfiddle就在上面 - 显然要使这个有用，你需要返回值而不是将它添加到div中 - 只是显示如何计算它。

Answer 3

试试这个。将barcode变量设置为您要搜索的条形码。我还转换为data-属性并提供了代码来计算和总结data-total_quantity：

HTML：

<input type="hidden" class="code" data-barcode="567" data-total_quantity="3" name="product1" value="Nokia rita" id="product-10105">
<input type="hidden" class="code" data-barcode="567" data-total_quantity="3" name="product1" value="Nokia rita" id="product-10106">
<input type="hidden" class="code" data-barcode="567" data-total_quantity="3" name="product1" value="Nokia rita" id="product-10107">
<input type="hidden" class="code" data-barcode="200" data-total_quantity="3" name="product1" value="book" class="product-200">

使用Javascript：

$(function () {
    var barcode = 567; // set to whatever you want to search for...
    var sumOfVals = 0;
    $("input.code[data-barcode='" + barcode + "']").each(function () {
        sumOfVals += parseInt($(this).data('total_quantity'), 10);
    });
    alert("Length: " + $("input.code[data-barcode='" + barcode + "']").length);
    alert("Sum: " +  sumOfVals);
});

小提琴：

http://jsfiddle.net/d89BR/4/

Answer 4

试试这个：

var barcode = 123;
var $123 = $('input[data-barcode="' + barcode + '"]');
var howMany = $123.length;

var sumOfQuantities = Function('return ' + $123.map(function () {
    return $(this).data('quantity');
}).get().join('+') + ';')();

var sumOfValues = Function('return ' + $123.map(function () {
    return $(this).val() || '0';
}).get().join('+') + ';')();

HTML（示例）：

<input data-barcode="123" data-quantity="123" value="123" />

Answer 5

不使用jQuery：

function getCount(barcode){
  var code = document.getElementsByClassName('code') ;
  var length = code.length ;
  var count = 0 ;
    for(var i = 0 ; i < length ; i++){
      if(code[i].attributes['barcode'].value == barcode) count++ ;
  }
  return count ;
}

// Test

alert(getCount(567)) ; // 3
alert(getCount(200)) ; // 1

Demo : http://jsfiddle.net/wz98E/

count预先定义输入属性的输入总数

5 个答案: