有没有办法解决这个问题?我想要发生的是,左侧的超链接将有总和,依此类推,在最后一页/标签上,所有超链接的总和将显示在那里。这里有一个更好地理解我的观点https://jsfiddle.net/nerdfighter/121myofn/1/
的jsFiddle这是我在添加已检查的chekcbox
时编写的初始JavaScript代码<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript">
window.onload = function() {
var inputs = document.getElementsByClassName('sum'),
total = document.getElementById('payment-total');
for (var i = 0; i < inputs.length; i++) {
inputs[i].onchange = function() {
var add = this.value * (this.checked ? 1 : -1);
total.innerHTML = parseFloat(total.innerHTML) + add
var new_total = parseFloat(document.getElementById('input').value);
console.log(new_total);
document.getElementById('input').value = new_total + add
}
}
}
</script>
这只是一个小项目,我不会使用服务器端。
答案 0 :(得分:0)
您的jsFiddle中没有id="payment-total"
或id="input"
元素。所以它不会工作。
该算法看起来正确。但我建议更多地关注严格的代码格式 - 这有助于避免错误。
我添加了以下几行,jsFiddle开始工作:
<span id="payment-total">0</span>
<input id="input" value="0">
评论更新:
// TODO: Start using addEventListener() instead
window.onload = function() {
var inputs = document.getElementsByClassName('sum'),
total = document.getElementById('payment-total');
for (var i = 0; i < inputs.length; i++) {
inputs[i].onchange = function() {
var add = this.value * (this.checked ? 1 : -1);
// TODO: Consider state variables instead of parsing innerHTML
// TODO: Never miss semicolons. It works, but causes hard debug sometimes
total.innerHTML = parseFloat(total.innerHTML) + add
var new_total = parseFloat(document.getElementById('input').value);
console.log(new_total);
document.getElementById('input').value = new_total + add
// Per tab total calculation
var tabTotalEl = document.getElementById(this.dataset.tabTotalId);
tabTotalEl.innerHTML = parseFloat(tabTotalEl.innerHTML) + add;
}
}
}
添加像这样的总和元素
<span id="tab-vegetables-total">0</span>
将data-tab-id="tab-vegetables-total"
属性添加到复选框。