Если в input введен процент от 1 до 100, в другую ячейку таблицы вывести процент от заданного числа

@Влад Громов · Регистрация: 12.09.2014

Как сделать так чтоб если в инпут ввести процент от 1 до 100, то в другую ячейку таблицы выведется процент от заданного числа

Добавлено через 4 минуты
и ещё это надо завернуть в функцию, просто я javascript только изучаю, а делать работу надо

@Vladislav WebDev · 21.12.2014, 23:11

Влад Громов, примерно так:

HTML5

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>some title</title>
</head>
<body>
    число <input type="text" name="num" placeholder='0'><br>
    процент <input type="text" name="procent" placeholder='0'><br>
    <div id="final-num"></div>
</body>
</html>

Javascript

window.onload = function() {
    var num = document.getElementsByName('num')[0];
    var procent = document.getElementsByName('procent')[0];
    var finalNum = document.getElementById('final-num');
    finalNum.innerHTML = num.value;
 
    num.onkeypress = function() {
        finalNum.innerHTML = parseInt(this.value / 100 * procent.value);
    }
    procent.onkeypress = function() {
        finalNum.innerHTML = parseInt(num.value / 100 * this.value);
    }
}

@Влад Громов · 22.12.2014, 11:18 **[ТС]**

Влад, спасибо вам за код, я переделал его немного под себя но теперь не работает

Javascript

function countData(dataOne) {
        var num = dataOne;
        var procent = document.getElementById('row_0').cells[2].getElementsByTagName('input')[0];
        var finalNum = document.getElementById('row_1').cells[2];
        finalNum.innerHTML = num.value;
     
        num.oninput = function() {
            finalNum.innerHTML = num.value * procent.value / 100;
        }
        procent.oninput = function() {
            finalNum.innerHTML = num.value * this.value / 100;
    }
}

Добавлено через 1 минуту
когда загружается страница, там где должен выходить finalNum там написано undefined, а когда начинаю вводить процент то вместо undefined выходит NaN

@Vladislav WebDev · 22.12.2014, 11:26

Влад Громов, Покажите весь ваш код полностью, вместе с разметкой и вызовом функции, подумаем

@Влад Громов · 22.12.2014, 12:23 **[ТС]**

Javascript

function countData(dataOne) {
        var num = dataOne;
        var procent = document.getElementById('row_0').cells[2].getElementsByTagName('input')[0];
        var finalNum = document.getElementById('row_1').cells[2];
        finalNum.innerHTML = num.value;
     
        num.oninput = function() {
            finalNum.innerHTML = num.value * procent.value / 100;
        }
        procent.oninput = function() {
            finalNum.innerHTML = num.value * this.value / 100;
    }
}
 
 
window.onload = function() {
    paste('cost',summa(cost));
    paste('all',summa(all));
    paste('procent',procentTotal_Cost(summa(all),summa(cost)) + '%');
    paste('total',summa(total));
    writeMasData('cost',cost);
    writeMasData('all',all);
    writeMasData('total',total);
    writeMasDataPr('procent',procent);
    countData(0.16);
}

Добавлено через 38 секунд

HTML5

<tr id="row_0">
        <td>1</td>
        <td class="left">ЗЕМЛЯННЫЕ РАБОТЫ</td>
        <td><input type="text" id="number" size="2"></td>
        <td><input type="text" id="percent" size="2"></td>
        <td><input type="text" id="result" size="2"></td>
        <td><input type="text" size="2"></td>
        <td><input type="text" size="2"></td>
        <td><input type="text" size="2"></td>
        <td><input type="text" size="2"></td>
        <td><input type="text" size="2"></td>
        <td><input type="text" size="2"></td>
        <td><input type="text" size="2"></td>
        <td><input type="text" size="2"></td>
        <td><input type="text" size="2"></td>
        <td rowspan="2" id="cost_0"></td>
        <td rowspan="2" id="all_0"></td>
        <td rowspan="2" id="procent_0"></td>
        <td rowspan="2" id="total_0"></td>
    </tr>
    <tr id="row_1">
        <td></td>
        <td class="left">СУММА</td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
    </tr>

Добавлено через 1 минуту
Вот в принципе вся относящаяся к этому скрипту часть, в дальнейшем этот скрипт будет применён к каждой ячейке, общее количество строк 51

@Vladislav WebDev · 22.12.2014, 13:13

Влад Громов, я не совсем понимаю что вам нужно, но у вас ерунда в js коде. попробуйте так:

Javascript

function countData(dataOne) {
        var procent = document.getElementById('row_0').cells[2].getElementsByTagName('input')[0];
        var finalNum = document.getElementById('row_1').cells[2];
        finalNum.innerHTML = dataOne;
 
        procent.oninput = function() {
            finalNum.innerHTML = dataOne * this.value / 100;
    }
}
 
 
window.onload = function() {
    paste('cost',summa(cost));
    paste('all',summa(all));
    paste('procent',procentTotal_Cost(summa(all),summa(cost)) + '%');
    paste('total',summa(total));
    writeMasData('cost',cost);
    writeMasData('all',all);
    writeMasData('total',total);
    writeMasDataPr('procent',procent);
    countData(0.16);
}

@Влад Громов 4 / 4 / 0 Регистрация: 12.09.2014 Сообщений: 60
		1
	Если в input введен процент от 1 до 100, в другую ячейку таблицы вывести процент от заданного числа 20.12.2014, 14:04. Показов 2989. Ответов 5 Метки нет (Все метки) Как сделать так чтоб если в инпут ввести процент от 1 до 100, то в другую ячейку таблицы выведется процент от заданного числа Добавлено через 4 минуты и ещё это надо завернуть в функцию, просто я javascript только изучаю, а делать работу надо 0

@Vladislav WebDev 327 / 217 / 97 Регистрация: 04.11.2012 Сообщений: 638
	22.12.2014, 11:26	4
	Влад Громов, Покажите весь ваш код полностью, вместе с разметкой и вызовом функции, подумаем 0

Опции темы

Если в input введен процент от 1 до 100, в другую ячейку таблицы вывести процент от заданного числа

Решение