Задать вопрос
Juodvirshis
@Juodvirshis

Как сделать так чтобы выводило итог с таблицы?

Как сделать так чтобы выводило итог с таблицы?
итог находил строку а выпадающее меню столбец.
и выводились конечные данные

например при ИТОГЕ 37
и 4 столбец
вывелось значение 1900

https://jsfiddle.net/ywxu9uxj/2/
<script type="text/javascript">
function calc() { 
 var operations = document.getElementById("operations");
 
 var workers = document.getElementById("workers");
 
 var system = document.getElementById("system"); 
 
 var result = document.getElementById("operations");
 var result = document.getElementById("workers");
 var result = document.getElementById("result_system");
 var result = document.getElementById("result");
 
 var price_operations = 0;
 var price_workers = 0;
 var price_system = 0; 
 
 var price = 0; 
 
 price_operations += parseInt(operations.value)*2;
 price_workers += parseInt(workers.value)*3;
 price_system += parseInt(system.options[system.selectedIndex].value);
 
 result_operations.innerHTML = price_operations;
 result_workers.innerHTML = price_workers;
 result_system.innerHTML = price_system;
 
 price=price_operations + price_workers;

 result.innerHTML = price;
} 
</script>
<table>
	<tr>
		<td width="100"><input type="text" id="operations" value="0" onchange="calc()" /></td>
		<td width="200"><span id="result_operations">0</span></td>
	</tr>
	<tr>
		<td width="100"><input type="text" id="workers" value="0" onchange="calc()" /></td>
		<td width="200"><span id="result_workers">0</span></td>
	</tr>
	<tr>
		<td width="250" class="td_result">ИТОГО:</td>
		<td class="td_result"><span id="result">0</span></td>
	</tr>
	<tr>
		<td width="100">
			<select onchange="calc()" id="system">
				<option value="">Не выбрано</option>
				<option value="0">1</option>
				<option value="1">2</option>
				<option value="2">3</option>
				<option value="3">4</option>
				<option value="4">5</option>
			</select>
		</td>
		<td width="200"><span id="result_system">0</span></td>
	</tr> 
</table>
<table>
	<tr>
		<td></td><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td>
	</tr>
	<tr>
		<td>0-3</td><td>100</td><td>200</td><td>300</td><td>400</td><td>500</td>
	</tr>
	<tr>
		<td>4-10</td><td>600</td><td>700</td><td>800</td><td>900</td><td>1000</td>
	</tr>
	<tr>
		<td>11-30</td><td>1100</td><td>1200</td><td>1300</td><td>1400</td><td>1500</td>
	</tr>
	<tr>
		<td>31-50</td><td>1600</td><td>1700</td><td>1800</td><td>1900</td><td>2000</td>
	</tr>
	<tr>
		<td>51-100</td><td>2100</td><td>2200</td><td>2300</td><td>2400</td><td>2500</td>
	</tr>
	<tr>
		<td>>100</td><td>100</td>
	</tr>
</table>
  • Вопрос задан
  • 139 просмотров
Подписаться 1 Оценить Комментировать
Решения вопроса 1
@IceJOKER
Web/Android developer
С помощью if/else находим нужную строку.
var selected_column = 0; //выбранный столбец из списка
var row_index = 0; //индекс строки
if(value > 0 && value < 4)
{
  row_index = 1;
}elseif(value > 3 && value < 11){
  row_index = 2;
}
...

А после находим нужный tr по его индексу и в нем уже ищем столбец по индексу:

var table = document.getElementsByTagName('table'); // получаем таблицы
var rows = table[1].getElementsByTagName('tr'); //выбираем все строки нужной таблицы(у вас их две, выбираем вторую(индекс начинается с 0)) данной таблицы
var columns = rows[4].getElementsByTagName('td'); //выбираем столбцы нужной строки, тут вводим индекс полученный после if/else
alert(columns[4].textContent); //и наконец получаем значение, тут вводим индекс выбранного столбца

Лучше с помощью jQuery
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы