gpt4 book ai didi

Javascript - 在字段中添加行和总和值

转载 作者:太空宇宙 更新时间:2023-11-04 16:07:40 24 4
gpt4 key购买 nike

我有一个包含此字段的表单,通过按钮我可以添加行:book_desc[]、book_pages[]。books_pages[] 总和的字段是 book_pages_tot。使用我的 javascript,我想在每个 book_pages 字段中添加具有值的行,并将这些值添加到 book_pages_tot 字段中,得到总值。

这是脚本:表单和字段

<form method="POST" action="addpages.php" name="books" onmouseover="javascript:sum();">

<button type="button" onClick="addRow('dataTable')"> Add pages </button>
<table id="dataTable" class="form">
<input type="text" class="form-control" name="book_pages[]" onblur="javascript:sum();">
<input type="text" class="form-control" name="book_pages_total" onblur="javascript:sum();">
</table>
</form>

JavaScript:

<script language="javascript">
function sum() {
var a = parseInt(document.books.book_pages[].value);
var result = a +a[];
document.books.tot_prestazioni_A.value = result;
}
</script>

这个脚本不起作用。如何对 book_pages_tot 字段中每个 book_pages[] 中放入的值求和?

我希望能解释我的问题。

谢谢

最佳答案

没有任何意义,所以我重写了整个事情。 action 是针对真实的测试服务器,但由于安全限制,它不会在 SO 中提交,但如果您自己使用它,它会提交。详细信息在代码片段中进行了评论。

片段

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1, user-scalable=no">
<title>00A00</title>
<style>
button,
input {
font: inherit;
}
.pages {
width: 6ch;
}
</style>
</head>

<body>
<form method="post" action="http://httpbin.org/post" name="books">
<button type="button" onClick="addRow()">Add Book</button>
<table id='dataTable'>
<tbody id='dataMain'>
<tr id='original' class='row'>
<td>
<input class='book' placeholder='Enter Title'>
</td>
<td>
<input type="number" class="form-control pages" name="pages" min='1' max='9999' value='1' oninput='totalPgs();'>
</td>
</tr>
</tbody>
<tbody>
<tr id='dataTotal'>
<td>
<input type='submit'>
</td>
<td>
<output id='total' class="form-control" name="total"></output>
</td>
</tr>
</tbody>
</table>
</form>
<script>
function addRow() {
// Reference the first <tr> as row
var row = document.getElementById('original');
// Reference the first <tbody> as main
var main = document.getElementById('dataMain');
// Clone row
var clone = row.cloneNode(true);
// Remove clone's id
clone.removeAttribute('id');
// Clean clone of any data
clone.querySelectorAll('input').forEach(function(inp) {
inp.value = ''
});
// Append clone as the last child of main
main.appendChild(clone);
}

function totalPgs() {
// Reference the <output> as out
var out = document.getElementById('total');
// Collect all nodes with class .pages into a NodeList called pgs
var pgs = document.querySelectorAll('.pages');

/* Array called arr is made by...
|| ...map.call pgs NodeList on each node called pg...
|| ...convert each pg value to a true number...
|| ...return all number values as an array called arr
*/
var arr = Array.prototype.map.call(pgs, function(pg) {
var cnt = parseInt(pg.value, 10);
return cnt;
});
// .apply the function sum() to array called arr
var total = sum.apply(sum, arr);
// The value of out is whatever total is
out.value = total;
// return the value of total
return total;
}

/* sum() will take any amount of numbers and add...
|| ...them up. Works best with .apply() or .call()
|| Usage:
|| var totalNumber = sum.apply(sum, array);
|| or
|| var totalNumber = sum.call(sum, object);
*/
function sum() {
var res = 0;
var i = 0;
var qty = arguments.length;
while (i < qty) {
res += arguments[i];
i++;
}
return res;
}
</script>
</body>

</html>

关于Javascript - 在字段中添加行和总和值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41754184/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com