【发布时间】：2019-03-19 01:53:43
【问题描述】：
我改变了跨度值，因此我需要获得跨度的总计。我给输入字段一个名为 "sumDiv" 的顶级 div id 我的 Span 也有这样的“名称”属性
var result = $("<span name='result'>");
计算所有跨度的函数如下：
function getDivSum(selector) {
var sum = 0;
$(selector).each(function() {
$(this`enter code here`).children("span").each(function() {
sum += parseInt($(this).html());
});
});
return sum;
}
$(document).ready(function() {
console.log(getDivSum("#sumDiv"));
});
我的总分是 0， 我做错了什么？ 这应该得到所有跨度值
$(this`enter code here`).children("span").each(function() {
但我在控制台日志上得到 0 值。
也试过了
$('.parent').each(function(){
var sum = 0;
var counts = $(this).find('.count');
counts.each(function() {
sum+= parseInt($(this).text());
});
console.log(sum);
});
无法让它工作。
Codepen： https://codepen.io/dunya/pen/MxXqrZ
谢谢
function myLoad() {
var apple = 777777;
var apricot = 111111 ;
var banana = 222222 ;
var bilberry = 3333 ;
var blackberry = 3333 ;
var blackcurrant = 2222 ;
var blueberry = 88888 ;
var boysenberry = 8888888 ;
var cherry = 99999 ;
var coconut = 99887 ;
$("#Apple").value = apple;
$("#Apricot").value = apricot;
$("#Banana").value = banana;
$("#Bilberry").value = bilberry;
$("#Blackberry").value = blackberry;
$("#Blackcurrant").value = blackcurrant;
$("#Blueberry").value = blueberry;
$("#Boysenberry").value = boysenberry;
$("#Cherry").value = cherry;
$("#Coconut").value = coconut;
}
function myCalculate(){
var volume = $("#Volume").val();
var productOrigin = $("#ProductOrigin").val();
var geographicalLocation = $("#GeoLocation").val();
if (volume === "" || productOrigin === "") {
// alert("Please select the product origin and volume.");
return;
}
var tableToUse = geographicalLocation === "" ? productOrigin : geographicalLocation;
$("input[type='text']").each(function(i){
// Current product ID, e.g. "Apple", "Apricot", etc.
var currentProductId = $(this).attr('id');
// Amount to multiply.
var multiplier = $(`table#${tableToUse} tbody > tr[product='${currentProductId}'] > td[volume='${volume}']`).text();
// A <span> element, to be populated with the calculated product volume.
var result = $("<span name='result'>");
// Calculate the figure and update the result element.
result.text($(this).val() * multiplier);
// Remove any previously added <span> result elements.
$(this).next("span").remove();
// Insert result after the current input field.
$(this).after(result);
// to calculate Grand total
function getDivSum(selector) {
var sum = 0;
$(selector).each(function() {
$(this).children("span").each(function() {
sum += parseInt($(this).html());
});
});
return sum;
}
$(document).ready(function() {
console.log(getDivSum("#sumDiv"));
});
});
}
myLoad();
$('.select').on('change', myCalculate);
$("input[type='text']").on('keyup', myCalculate);<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div>
<label class="description" for="ProductOrigin">Product Origin</label>
<select class="element select medium" id="ProductOrigin" name="ProductOrigin">
<option value="" selected="selected"></option>
<option value="Europe">Europe</option>
<option value="Asia">Asia</option>
<option value="China">China</option>
<option value="India">India</option>
<option value="USA">USA</option>
<option value="Africa">Africa</option>
</select>
</div>
<div>
<label class="description" for="GeoLocation">Geographical Location</label>
<select class="element select medium" id="GeoLocation" name="GeoLocation">
<option value="" selected="selected"></option>
<option value="England">England</option>
<option value="Scotland">Scotland</option>
<option value="Wales">Wales</option>
</select>
</div>
<div>
<label class="description" for="Volume">Volume</label>
<select class="element select medium" id="Volume" name="Volume">
<option value="" selected="selected"></option>
<option value="10">10</option>
<option value="100">100</option>
<option value="1000">1000</option>
<option value="2000">2000</option>
<option value="3000">3000</option>
<option value="4000">4000</option>
<option value="5000">5000</option>
<option value="6000">6000</option>
<option value="6000">6000</option>
<option value="8000">8000</option>
<option value="9000">9000</option>
<option value="10000">10000</option>
<option value="20000">20000</option>
<option value="30000">30000</option>
<option value="40000">40000</option>
<option value="50000">50000</option>
</select>
</div>
<div id="sumDiv">
<div>
<label class="description" for="Apple">Apple</label>
<input id="Apple" name="Apple" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
<label class="description" for="Apricot">Apricot</label>
<input id="Apricot" name="Apricot" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
<label class="description" for="Banana">Banana</label>
<input id="Banana" name="Banana" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
<label class="description" for="Bilberry">Bilberry</label>
<input id="Bilberry" name="Bilberry" class="element text medium" type="text" maxlength="255" value="10" readonly="true" />
</div>
<div>
<label class="description" for="Blackberry">Blackberry</label>
<input id="Blackberry" name="Blackberry" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
<label class="description" for="Blackcurrant">Blackcurrant</label>
<input id="Blackcurrant" name="Blackcurrant" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
<label class="description" for="Blueberry">Blueberry</label>
<input id="Blueberry" name="Blueberry" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
<label class="description" for="Boysenberry">Boysenberry</label>
<input id="Boysenberry" name="Boysenberry" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
<label class="description" for="Cherry">Cherry</label>
<input id="Cherry" name="Cherry" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
<label class="description" for="Coconut">Coconut</label>
<input id="Coconut" name="Coconut" class="element text medium" type="text" maxlength="255" value="10" readonly="true"/>
</div>
<div>
<label class="description" for="GrandTotal">Grand Total</label>
<input id="GrandTotal" name="GrandTotal" class="element text medium" type="text" maxlength="255" value="" readonly="true"/>
</div>
</div>
<table id="Europe">
<thead>Europe</thead>
<tr>
<td>Europe</td>
<th id=10>10</th>
<th id=100>100</th>
<th id=1000>1000</th>
<th id=2000>2000</th>
<th id=3000>3000</th>
<th id=4000>4000</th>
<th id=5000>5000</th>
<th id=6000>6000</th>
<th id=7000>7000</th>
<th id=8000>8000</th>
<th id=9000>9000</th>
<th id=10000>10000</th>
<th id=20000>20000</th>
<th id=30000>30000</th>
<th id=40000>40000</th>
<th id=50000>50000</th>
</tr>
<tbody>
<tr product='Apple'>
<td>Apple</td>
<td volume='10'>0.1</td>
<td volume='100'>0.5</td>
<td volume='1000'>1</td>
<td volume='2000'>2</td>
<td volume='3000'>3</td>
<td volume='4000'>4</td>
<td volume='5000'>5</td>
<td volume='6000'>6</td>
<td volume='7000'>7</td>
<td volume='8000'>8</td>
<td volume='9000'>9</td>
<td volume='10000'>10</td>
<td volume='20000'>11</td>
<td volume='30000'>12</td>
<td volume='40000'>13</td>
<td volume='50000'>14</td>
</tr>
<tr product='Apricot'>
<td>Apricot</td>
<td volume='10'>0</td>
<td volume='100'>0</td>
<td volume='1000'>0</td>
<td volume='2000'>0.5</td>
<td volume='3000'>1</td>
<td volume='4000'>1.5</td>
<td volume='5000'>2</td>
<td volume='6000'>2.5</td>
<td volume='7000'>3</td>
<td volume='8000'>3.5</td>
<td volume='9000'>4</td>
<td volume='10000'>4.5</td>
<td volume='20000'>5</td>
<td volume='30000'>5.5</td>
<td volume='40000'>6</td>
<td volume='50000'>7</td>
</tr>
<tr product='Banana'>
<td>Banana</td>
<td volume='10'>0.1</td>
<td volume='100'>0.5</td>
<td volume='1000'>1</td>
<td volume='2000'>5</td>
<td volume='3000'>10</td>
<td volume='4000'>15</td>
<td volume='5000'>20</td>
<td volume='6000'>25</td>
<td volume='7000'>27</td>
<td volume='8000'>30</td>
<td volume='9000'>33</td>
<td volume='10000'>36</td>
<td volume='20000'>40</td>
<td volume='30000'>45</td>
<td volume='40000'>50</td>
<td volume='50000'>55</td>
</tr>
<tr product='Bilberry'>
<td>Bilberry</td>
<td volume='10'>1</td>
<td volume='100'>5</td>
<td volume='1000'>10</td>
<td volume='2000'>15</td>
<td volume='3000'>20</td>
<td volume='4000'>25</td>
<td volume='5000'>30</td>
<td volume='6000'>35</td>
<td volume='7000'>40</td>
<td volume='8000'>45</td>
<td volume='9000'>50</td>
<td volume='10000'>55</td>
<td volume='20000'>60</td>
<td volume='30000'>65</td>
<td volume='40000'>70</td>
<td volume='50000'>75</td>
</tr>
<tr product='Blackberry'>
<td>Blackberry</td>
<td volume='10'>0.1</td>
<td volume='100'>5</td>
<td volume='1000'>10</td>
<td volume='2000'>20</td>
<td volume='3000'>50</td>
<td volume='4000'>75</td>
<td volume='5000'>100</td>
<td volume='6000'>125</td>
<td volume='7000'>150</td>
<td volume='8000'>175</td>
<td volume='9000'>200</td>
<td volume='10000'>225</td>
<td volume='20000'>250</td>
<td volume='30000'>275</td>
<td volume='40000'>300</td>
<td volume='50000'>350</td>
</tr>
<tr product='Blackcurrant'>
<td>Blackcurrant</td>
<td volume='10'>0.1</td>
<td volume='100'>0.5</td>
<td volume='1000'>1</td>
<td volume='2000'>2</td>
<td volume='3000'>2</td>
<td volume='4000'>4</td>
<td volume='5000'>4</td>
<td volume='6000'>4</td>
<td volume='7000'>6</td>
<td volume='8000'>6</td>
<td volume='9000'>6</td>
<td volume='10000'>8</td>
<td volume='20000'>8</td>
<td volume='30000'>10</td>
<td volume='40000'>12</td>
<td volume='50000'>14</td>
</tr>
<tr product='Blueberry'>
<td>Blueberry</td>
<td volume='10'>0.1</td>
<td volume='100'>0.5</td>
<td volume='1000'>1</td>
<td volume='2000'>4</td>
<td volume='3000'>6</td>
<td volume='4000'>8</td>
<td volume='5000'>10</td>
<td volume='6000'>12</td>
<td volume='7000'>14</td>
<td volume='8000'>16</td>
<td volume='9000'>18</td>
<td volume='10000'>20</td>
<td volume='20000'>24</td>
<td volume='30000'>28</td>
<td volume='40000'>30</td>
<td volume='50000'>36</td>
</tr>
<tr product='Boysenberry'>
<td>Boysenberry</td>
<td volume='10'>0.5</td>
<td volume='100'>1</td>
<td volume='1000'>2.5</td>
<td volume='2000'>4</td>
<td volume='3000'>5.5</td>
<td volume='4000'>7</td>
<td volume='5000'>8.5</td>
<td volume='6000'>10</td>
<td volume='7000'>11.5</td>
<td volume='8000'>13</td>
<td volume='9000'>14.5</td>
<td volume='10000'>16</td>
<td volume='20000'>17.5</td>
<td volume='30000'>19</td>
<td volume='40000'>20.5</td>
<td volume='50000'>22</td>
</tr>
<tr product='Cherry'>
<td>Cherry</td>
<td volume='10'>0.5</td>
<td volume='100'>1</td>
<td volume='1000'>2.5</td>
<td volume='2000'>5</td>
<td volume='3000'>8</td>
<td volume='4000'>10</td>
<td volume='5000'>15</td>
<td volume='6000'>20</td>
<td volume='7000'>25</td>
<td volume='8000'>28</td>
<td volume='9000'>31</td>
<td volume='10000'>35</td>
<td volume='20000'>40</td>
<td volume='30000'>45</td>
<td volume='40000'>50</td>
<td volume='50000'>55</td>
</tr>
<tr product='Coconut'>
<td>Coconut</td>
<td volume='10'>0.1</td>
<td volume='100'>0.25</td>
<td volume='1000'>0.5</td>
<td volume='2000'>0.5</td>
<td volume='3000'>1</td>
<td volume='4000'>1</td>
<td volume='5000'>2</td>
<td volume='6000'>2</td>
<td volume='7000'>2</td>
<td volume='8000'>2</td>
<td volume='9000'>2.5</td>
<td volume='10000'>2.5</td>
<td volume='20000'>3</td>
<td volume='30000'>3</td>
<td volume='40000'>3</td>
<td volume='50000'>3</td>
</tr>
</tbody>
</table>
<table id="England">
<thead>England</thead>
<tr>
<td>England</td>
<th id=10>10</th>
<th id=100>100</th>
<th id=1000>1000</th>
<th id=2000>2000</th>
<th id=3000>3000</th>
<th id=4000>4000</th>
<th id=5000>5000</th>
<th id=6000>6000</th>
<th id=7000>7000</th>
<th id=8000>8000</th>
<th id=9000>9000</th>
<th id=10000>10000</th>
<th id=20000>20000</th>
<th id=30000>30000</th>
<th id=40000>40000</th>
<th id=50000>50000</th>
</tr>
<tbody>
<tr product='Apple'>
<td>Apple</td>
<td volume='10'>10</td>
<td volume='100'>10</td>
<td volume='1000'>10</td>
<td volume='2000'>20</td>
<td volume='3000'>30</td>
<td volume='4000'>40</td>
<td volume='5000'>50</td>
<td volume='6000'>60</td>
<td volume='7000'>70</td>
<td volume='8000'>80</td>
<td volume='9000'>90</td>
<td volume='10000'>100</td>
<td volume='20000'>110</td>
<td volume='30000'>120</td>
<td volume='40000'>130</td>
<td volume='50000'>140</td>
</tr>
<tr product='Apricot'>
<td>Apricot</td>
<td volume='10'>10</td>
<td volume='100'>10</td>
<td volume='1000'>10</td>
<td volume='2000'>20</td>
<td volume='3000'>30</td>
<td volume='4000'>40</td>
<td volume='5000'>50</td>
<td volume='6000'>60</td>
<td volume='7000'>70</td>
<td volume='8000'>80</td>
<td volume='9000'>90</td>
<td volume='10000'>100</td>
<td volume='20000'>110</td>
<td volume='30000'>120</td>
<td volume='40000'>130</td>
<td volume='50000'>140</td>
</tr>
<tr product='Banana'>
<td>Banana</td>
<td volume='10'>1</td>
<td volume='100'>5</td>
<td volume='1000'>1</td>
<td volume='2000'>5</td>
<td volume='3000'>10</td>
<td volume='4000'>15</td>
<td volume='5000'>20</td>
<td volume='6000'>25</td>
<td volume='7000'>27</td>
<td volume='8000'>30</td>
<td volume='9000'>33</td>
<td volume='10000'>36</td>
<td volume='20000'>40</td>
<td volume='30000'>45</td>
<td volume='40000'>50</td>
<td volume='50000'>55</td>
</tr>
<tr product='Bilberry'>
<td>Bilberry</td>
<td volume='10'>1</td>
<td volume='100'>5</td>
<td volume='1000'>10</td>
<td volume='2000'>15</td>
<td volume='3000'>20</td>
<td volume='4000'>25</td>
<td volume='5000'>30</td>
<td volume='6000'>35</td>
<td volume='7000'>40</td>
<td volume='8000'>45</td>
<td volume='9000'>50</td>
<td volume='10000'>55</td>
<td volume='20000'>60</td>
<td volume='30000'>65</td>
<td volume='40000'>70</td>
<td volume='50000'>75</td>
</tr>
<tr product='Blackberry'>
<td>Blackberry</td>
<td volume='10'>0.1</td>
<td volume='100'>5</td>
<td volume='1000'>10</td>
<td volume='2000'>20</td>
<td volume='3000'>50</td>
<td volume='4000'>75</td>
<td volume='5000'>100</td>
<td volume='6000'>125</td>
<td volume='7000'>150</td>
<td volume='8000'>175</td>
<td volume='9000'>200</td>
<td volume='10000'>225</td>
<td volume='20000'>250</td>
<td volume='30000'>275</td>
<td volume='40000'>300</td>
<td volume='50000'>350</td>
</tr>
<tr product='Blackcurrant'>
<td>Blackcurrant</td>
<td volume='10'>20</td>
<td volume='100'>5</td>
<td volume='1000'>1</td>
<td volume='2000'>2</td>
<td volume='3000'>2</td>
<td volume='4000'>4</td>
<td volume='5000'>4</td>
<td volume='6000'>4</td>
<td volume='7000'>6</td>
<td volume='8000'>6</td>
<td volume='9000'>6</td>
<td volume='10000'>8</td>
<td volume='20000'>8</td>
<td volume='30000'>10</td>
<td volume='40000'>12</td>
<td volume='50000'>14</td>
</tr>
<tr product='Blueberry'>
<td>Blueberry</td>
<td volume='10'>41</td>
<td volume='100'>51</td>
<td volume='1000'>1</td>
<td volume='2000'>4</td>
<td volume='3000'>6</td>
<td volume='4000'>8</td>
<td volume='5000'>10</td>
<td volume='6000'>12</td>
<td volume='7000'>14</td>
<td volume='8000'>16</td>
<td volume='9000'>18</td>
<td volume='10000'>20</td>
<td volume='20000'>24</td>
<td volume='30000'>28</td>
<td volume='40000'>30</td>
<td volume='50000'>36</td>
</tr>
<tr product='Boysenberry'>
<td>Boysenberry</td>
<td volume='10'>500</td>
<td volume='100'>10</td>
<td volume='1000'>25</td>
<td volume='2000'>4</td>
<td volume='3000'>5</td>
<td volume='4000'>7</td>
<td volume='5000'>8</td>
<td volume='6000'>10</td>
<td volume='7000'>15</td>
<td volume='8000'>13</td>
<td volume='9000'>14</td>
<td volume='10000'>16</td>
<td volume='20000'>175</td>
<td volume='30000'>19</td>
<td volume='40000'>205</td>
<td volume='50000'>22</td>
</tr>
<tr product='Cherry'>
<td>Cherry</td>
<td volume='10'>0.5</td>
<td volume='100'>1</td>
<td volume='1000'>2.5</td>
<td volume='2000'>5</td>
<td volume='3000'>8</td>
<td volume='4000'>10</td>
<td volume='5000'>15</td>
<td volume='6000'>20</td>
<td volume='7000'>25</td>
<td volume='8000'>28</td>
<td volume='9000'>31</td>
<td volume='10000'>35</td>
<td volume='20000'>40</td>
<td volume='30000'>45</td>
<td volume='40000'>50</td>
<td volume='50000'>55</td>
</tr>
<tr product='Coconut'>
<td>Coconut</td>
<td volume='10'>41</td>
<td volume='100'>5</td>
<td volume='1000'>115</td>
<td volume='2000'>445</td>
<td volume='3000'>1</td>
<td volume='4000'>1</td>
<td volume='5000'>2</td>
<td volume='6000'>2</td>
<td volume='7000'>2</td>
<td volume='8000'>2</td>
<td volume='9000'>2</td>
<td volume='10000'>14</td>
<td volume='20000'>3</td>
<td volume='30000'>3</td>
<td volume='40000'>3</td>
<td volume='50000'>3</td>
</tr>
</tbody>
</table>
<div class="">
<table id="multiplierSemtricaValues">
<thead><strong>multiplierSemtricaValues</strong></thead>
<tr>
<td><strong>multiplierSemtricaValues</strong></td>
<td id="">Value to apply</td>
</tr>
<tbody>
<tr Semtrica='Apple'>
<td>Apple</td>
<td valueToCalc='Apple'>65</td>
</tr>
<tr Semtrica='Apricot'>
<td>Apricot</td>
<td valueToCalc='Apricot'>141</td>
</tr>
<tr Semtrica='Banana'>
<td>Banana</td>
<td valueToCalc='Banana'>100</td>
</tr>
<tr Semtrica='Bilberry'>
<td>Bilberry</td>
<td valueToCalc='Bilberry'>10.47</td>
</tr>
<tr Semtrica='Blackberry'>
<td>Blackberry</td>
<td valueToCalc='Blackberry'>312</td>
</tr>
<tr Semtrica='Blackcurrant'>
<td>Blackcurrant</td>
<td valueToCalc='Blackcurrant'>292</td>
</tr>
<tr Semtrica='Blueberry'>
<td>Blueberry</td>
<td valueToCalc='Blueberry'>32</td>
</tr>
<tr Semtrica='Boysenberry'>
<td>Boysenberry</td>
<td valueToCalc='Boysenberry'>50</td>
</tr>
<tr Semtrica='Cherry'>
<td>Cherry</td>
<td valueToCalc='Cherry'>100</td>
</tr>
<tr Semtrica='Cherry'>
<td>Cherry</td>
<td valueToCalc='Cherry'>50</td>
</tr>
</tbody>
</table>
</div>【问题讨论】：
-
你能修剪你的代码并保留相关部分吗？
-
供将来参考-您在问题中投入了大量工作，但结果是 TMI。我将您的代码 sn-p 复制到一个新答案中，以尝试解决它，但我不知道该单击什么，如何查看错误。我想我本可以花半个小时或更长时间来弄清楚，但这不是 SO 的工作方式。 请创建最小的、有效的代码示例 - 相信我，为问题创建演示所花费的时间将节省您等待答案的两倍 - 有时您会自己找到答案在创建问题时。只是我的 0.02 美元。
-
您的控制台日志的问题是因为您在 doc ready 时调用它，而当 doc 准备好时，任何地方都没有任何值，所以您将得到 0
-
@gibberish，是的，你可能是对的?
标签： javascript jquery