Как сложить все ячейки в каждом столбце?
Здравствуйте всем.
Я еще только начинаю учить js и попрошу сразу не кидаться камнями. Мне нужен простой скрипт, который будет брать все значения ячеек из таблицы и суммировать их в столбцах. Иными словами мне нужно получить суммы каждого из столбцов таблицы и вывести их через div. <!DOCTYPE> <html> <head></head> <body> <table class="journal" id="main" > <tbody> <tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> </tr> <tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> </tr> <tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> </tr> </tbody> </table> <div class="val-1"></div> // Значение суммы единиц <div class="val-2"></div> // Значение суммы двоек <div class="val-3"></div> // Значение суммы троек <div class="val-4"></div> // Значение суммы четверок <div class="val-5"></div> // Значение суммы пятерок </body> </html> Помогите, пожалуйста :help: |
Chamus,
может для начала tbody в table вместо div |
Цитата:
|
Chamus,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function () {
$("div").each(function (indx) {
var sum = 0;
$("td:nth-child(" + (indx + 1) + ")", "#main").each(function () {
sum += +$(this).text()
});
$(this).text(sum)
});
})
</script>
</head>
<body>
<table class="journal" id="main" >
<tbody>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
</tbody>
</table>
<div class="val-1"></div> // Значение суммы единиц
<div class="val-2"></div> // Значение суммы двоек
<div class="val-3"></div> // Значение суммы троек
<div class="val-4"></div> // Значение суммы четверок
<div class="val-5"></div> // Значение суммы пятерок
</body>
</html>
|
Thanks!
|
рони, не хочу наглеть, но спрошу еще кое-что :)
Вот ваша чудесная функция:
$(function () {
$("div").each(function (indx) {
var sum = 0;
$("td:nth-child(" + (indx + 1) + ")", "#main").each(function () {
sum += +$(this).text()
});
$(this).text(sum)
});
})
Помогите, пожалуйста, вывести результат в этой таблице. Эта таблица будет находиться снизу страницы. Каждая ячейка будет под соответствующим столбцом, в которой должна быть сумма значений этого столбца. <table> <tbody> <tr id="roni"> <td>Сумма первого столбца</td> <td>Сумма второго столбца</td> <td>Сумма третьего столбца</td> <td>Сумма четвертого столбца</td> <td>Сумма пятого столбца</td> </tr> </tbody> </table> |
Chamus,
$("div") поменять на $("#roni td") |
Цитата:
|
Chamus,
:cray:
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
td{
width: 30px;
text-align: center;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
$(function () {
$(".journal tr:first td").each(function (indx) {
var sum = 0;
$("td:nth-child(" + (indx + 1) + ")", ".journal").each(function () {
sum += +$(this).text()
});
$("<td/>",{text:sum}).appendTo("#test")
});
})
</script>
</head>
<body>
<table class="journal" id="main" >
<tbody>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
</tbody>
</table>
<table>
<tbody>
<tr id="test">
</tr>
</tbody>
</table>
</body>
</html>
|
рони, не работает на сайте :(
Подскажи, что не так! http://pastebin.com/tvJCpREc Функция в конце // Расчет Может не хочет работать, потому что на сайте несколько таблиц. |
| Часовой пояс GMT +3, время: 19:45. |