JavaScript 数値入力で更新．
<body>
<pre>
c : <input type='number' id='in__c' value='8' style='width:100px;' step='any' /> <span id='out_c'> </span> <br />
s : <input type='number' id='in__s' value='2' style='width:100px;' step='any' /> <span id='out_s'> </span> <br />
r : <input type='number' id='in__r' value='5' style='width:100px;' step='any' /> <span id='out_r'> </span> <br />
</pre>
<img src='r_cs.png' width='300px'>
<script>
function r_cs (c , s) { return ( ( c*c ) / ( 8*s ) + s/2 ) ; }
function s_rc (r , c) { return ( r-Math.sqrt(r*r - (c/2)*(c/2) ) ) ; }
function c_rs (r , s) { return ( Math.sqrt(r*r - (r-s)*(r-s) )*2 ) ; }
function f_c_rs () {
var oc = document.querySelector("#out_c") ;
var os = document.querySelector("#out_s") ;
var or = document.querySelector("#out_r") ;
var ic = document.querySelector("#in__c") ;
var is = document.querySelector("#in__s") ;
var ir = document.querySelector("#in__r") ;
var fc = parseFloat(ic.value) ;
var fs = parseFloat(is.value) ;
var fr = parseFloat(ir.value) ;
oc.textContent = "" ;
os.textContent = "" ;
or.textContent = "" ;
os.textContent = s_rc(fr,fc) ;
or.textContent = r_cs(fc,fs) ;
}
// ...
{
var ec = document.getElementById("in__c") ;
var es = document.getElementById("in__s") ;
var er = document.getElementById("in__r") ;
ec.addEventListener("keyup",f_c_rs, false) ;
es.addEventListener("keyup",f_s_rc, false) ;
er.addEventListener("keyup",f_r_cs, false) ;
}
</script>
</body>
