Question

I have a few <input> elements that look like this:

<input id="hosts" name="250" class="hostselector" type="number" min="0" max="999" value="0" />

I would like to multiply the value (that the user enters) with the value I’m storing in name.

Now there’s several elements of this on the page, all with the class="hostselector". I’d like to get the sum of all the values, so in a sense:

(value * name) + (value * name) + .... every single element with that class.

How would I do that using jquery?

Answer 1

var total = 0;
$(".hostselector").each(function() {
    total+= parseInt(this.value, 10) * parseInt($(this).attr("name"), 10);
});

This loops through all elements with class .hostselector, multiples the current value by the value of the name attribute (which is a string, hence the use of parseInt), and maintains a running total of all elements.

Here’s an example fiddle showing it working (just click the button to see the final result).