Как сделать так чтоб если в инпут ввести процент от 1 до 100, то...
Как сделать так чтоб если в инпут ввести процент от 1 до 100, то в другую ячейку таблицы выведется процент от заданного числа
и ещё это надо завернуть в функцию, просто я javascript только изучаю |
<html>
<head>
</head>
<body>
<table>
<tr> <td> type number: </td> <td> type percent: </td> <td> result </td> </tr>
<tr> <td> <input id="number" /> </td> <td> <input id="percent" /></td> <td> <input id="result" > </td> </tr>
</table>
<button> get </button>
<script>
get=document.querySelector.bind(document)
number=get("#number")
percent=get("#percent")
result=get("#result")
button=get("button")
button.onclick=function(){result.value=percent.value*(number.value/100)}
</script>
</body>
</html>
|
можно и без кнопки
<html>
<head>
</head>
<body>
<table>
<tr> <td> type number: </td> <td> type percent: </td> <td> result </td> </tr>
<tr> <td> <input id="number" /> </td> <td> <input id="percent" /></td> <td> <input id="result" > </td> </tr>
</table>
<script>
get=document.querySelector.bind(document)
number=get("#number")
percent=get("#percent")
result=get("#result")
getPercent=function(){
if((number.value==="")||(percent.value==="")) return result.value="waiting..."
result.value=percent.value*(number.value/100)
}
number.oninput=getPercent
percent.oninput=getPercent
</script>
</body>
</html>
|
а можно ли сделать чтоб не по ID а вот так:
.getElementById('row_0').cells[2].getElementsByTagName('input').value
Просто у меня большая таблица и там будет много таких подсчётов, и по id делать будет очень трудно, так как придётся вписывать около 1000 id |
Вот так, вроде, получается
<html>
<head>
</head>
<body>
<table>
<tr> <td> type number: </td> <td> type percent: </td> <td> result </td> </tr>
<tr> <td> <input /> </td> <td> <input /></td> <td> <input /> </td> </tr>
<tr> <td> <input /> </td> <td> <input /></td> <td> <input /> </td> </tr>
<tr> <td> <input /> </td> <td> <input /></td> <td> <input /> </td> </tr>
</table>
<script>
table=document.querySelector("table")
trs=(table.querySelectorAll("tr"))
add=function(inputs){
var number=inputs[0]
var percent=inputs[1]
var result=inputs[2]
var getPercent=function(){
if((number.value==="")||(percent.value==="")) return result.value="waiting..."
result.value=percent.value*(number.value/100)
}
number.oninput=getPercent
percent.oninput=getPercent
}
for(var i=1; i<trs.length; i++) {
add(trs[i].querySelectorAll("input"))
}
</script>
</body>
</html>
|
Спасибо вам за скрипт, конечно придётся под пилить, но вы мне очень помогли
|
:write:
на всякий случай Цитата:
result.value=percent.value*(number.value/100) |
рони,
Вроде, мой вариант работает, в чем проблема? Я исходил из того, что заданное число -- это поле number. Поясни пжста, я в мат-ке не силен:) |
krutoy,
6 процент 1 результат 0.06 у ТС результат 16.666666666666668 |
да это я исправил
result.value=(number.value*percent.value)/100 |
рони,
Точно, спасибо, исправил. Но че то я не догоняю, мне казалось, что это одно и то же. Откуда эта хрень? Он, получается врал только на цифрах меньше 10? |
Цитата:
|
рони,
Да, я запарился. Я хотел написать number.value/(100/percent.value) Так вроде, также работает, только округляет почему-то по разному, точней, флоаты по разному отображаются на некоторых данных
<html>
<head>
</head>
<body>
number: <input id="number" /> <br />
percent: <input id="percent" /> <br />
Rony result: <input id="rony" /> <br />
Krutoy result: <input id="krutoy" />
<script>
get=document.querySelector.bind(document)
number=get("#number")
percent=get("#percent")
rony=get("#rony")
krutoy=get("#krutoy")
getPercent=function(){
if((number.value==="")||(percent.value==="")) return rony.value=krutoy.value="waiting..."
rony.value=percent.value*(number.value/100)
krutoy.value=number.value/(100/percent.value)
}
number.oninput=percent.oninput=getPercent
</script>
</body>
</html>
|
krutoy,
уберите скобки из моего варианта и получите ваш |
| Часовой пояс GMT +3, время: 08:18. |