Как суммировать значения непустых элементов в Javascript или JQuery
Я пытаюсь сделать общую сумму всех html внутри <td>
элементов с именем= 'gross_val'. У меня есть следующие элементы <td>
:
<tr><td name="gross_val" align="right" title="gross_val1" ></td></tr>
<tr><td name="gross_val" align="right" title="gross_val2" ></td></tr>
<tr><td name="gross_val" align="right" title="gross_val3" ></td></tr>
<tr><td name="gross_val" align="right" title="gross_val4" ></td></tr>
<tr><td name="gross_val" align="right" title="gross_val5" ></td></tr>
Все эти элементы <td>
были динамически заполнены значениями в них. Некоторые из этих <td>
элементов имеютваловые суммарные значения из <tr>
, которые они находятся внутри, а некоторые из них еще не заселены. Я просто хочу суммировать те <td>
элементы, которые были заполненываловыми суммарными значениями . А потом покажу это значение в другом элементе <td>
.
Для этого я написал следующие JQuery и Javascript:
function computeGrossValTotal() {
var x = $("td[name='gross_val']");
var gValues = [];
$(x).each(function(index) {
// this line takes up the raw html inside of that td element
var valc = $(this).html();
// this line strips all the currency and other characters and symbols
// off the 'valc' variable and makes it in an integer format
var val = Number(WC(valc));
if (val) {
gValues.push(val);
}
});
// this line adds the values inside of gValues array
sum = Number(gValues.reduce(add, 0));
alert(sum);
}
$(document).on("keyup", function() {
computeGrossValTotal();
});
function WC(x) { return Number(x.match(/(?:d+|.)/g).join("")); }
function add(a, b) {return a + b;}
Проблема, с которой я сталкиваюсь, заключается в том, что sum не предупреждает, если все элементы <td>
не имеют некоторого html внутри них. Я не могу сделать, чтобы удалить пустые элементы TD из уравнения. Пожалуйста, кто-нибудь может указать мне, как суммировать только те элементы <td>
, которые имеют некоторое значение внутри них.
2 ответа:
WC
нужно проверить, чтоx.match()
что-то находит, поэтому он не вызываетjoin
наnull
.function WC(x) { var nums = x.match(/(?:\d+|\.)/g); if (nums) { return Number(nums.join('')); } else { return null; } }
X. match ([[regex]]) вернет либо массив совпадений, либо null, если он не соответствует регулярному выражению.
Когда у вас есть элемент без html, вы и вы делаете $(элемент).html (), вы получите пустую строку, поэтому x. match ([[regex]]) не будет соответствовать вашей пустой строке и вернет null. Тогда вы попытаетесь это сделать .соедините ("") с нулем, и вы получите ошибку.
Как я написал в комментарии, Вы можете сделать что-то вроде:
var valc = $(this).html() || "0";
Или, в вашем случае, я бы изменил функцию WC чтобы уберечь его от попыток казнить .присоединяйтесь к нулю и заставьте его вернуть 0 (так как это не повлияет на ваше добавление) в случае, если это так .матч возвращает null.