javascript - HTML Text Field Math / Displaying Answer in Text Field -
i don't have much experience html or javascript coding , trying create simple calculation app. have far:
<!doctype html> <html> <head> <style> #p1 { float:left; padding:5px 150px; } #h1 { float:left; padding:5px 150px; } #v1 { float:left; padding:5px 150px; } #p2 { padding:5px 150px; } #h2 { padding:5px 150px; } #v2 { padding:5px 150px; } </style> </head> <body> <h1><center><b>bernoulli's energy balance</b></center></h1> <center><h2>p<sub>1</sub> + ρ*g*h<sub>1</sub> + ρ*(<sup>v<sub>1</sub><sup>2</sup></sup>⁄<sub>2</sub>) = p<sub>2</sub> + ρ*g*h<sub>2</sub> + ρ*(<sup>v<sub>2</sub><sup>2</sup></sup>⁄<sub>2</sub>) + ρ*f</h2></center> <form name="boxes" action=""> <div id="p1" name="p1"> p<sub>1</sub>:<input type="text" name="p1" size=3></div> <div id="p2" name="p2" align="right"> p<sub>2</sub>:<input type="text" name="p2" size=3><br></div><br> <div id="h1" name="h1"> h<sub>1</sub>:<input type-"text" name="h1" size=3></div> <div id="h2" name="h2" align="right"> h<sub>2</sub>:<input type-"text" name="h2" size=3></div><br> <div id="v1" name="v1"> v<sub>1</sub>:<input type-"text" name="v1" size=3></div> <div id="v2" name="v2" align="right"> v<sub>2</sub>:<input type-"text" name="v2" size=3></div><br> <div id="rho" name="rho" align="center"> ρ:<input type="text" name="rho" size=3></div><br> <div id="f" name="f" align="center"> f:<input type="text" name="f" size=3></div><br> <div id="g" name="g" align="center"> g:<input type="text" name="g" size=3 value="9.8"></div><br> <input type="button" onclick="calculate();" value="calculate"> </form> <script type="text/javascript" language="javascript" charset="utf-8"> function isempty(id) { var text = document,getelementbyid(id).value; if (!text.match(/\s/)){ homecoming true; } else{ homecoming false; } } function calculate(){ var p1 = parseint(document.getelementbyid("p1").value); var p2 = parseint(document.getelementbyid("p2").value); var h1 = parseint(document.getelementbyid("h1").value); var h2 = parseint(document.getelementbyid("h2").vaule); var v1 = parseint(document.getelementbyid("v1").value); var v2 = parseint(document.getelementbyid("v2").value); var rho = parseint(document.getelementbyid("rho").value); var f = parseint(document.getelementbyid("f").value); var g = parseint(document.getelementbyid("g").value); var lside = p1+(rho*g*h1)+(rho*((v1^2)/2)); var rside = p2+(rho*g*h2)+(rho*((v2^2)/2))+(rho*f); var ans = 0; if (isempty(p1)){ ans = rside-(rho*((v1^2)/2))-(rho*g*h1); document.getelementbyid("p1").value = ans.tostring(); } else if (isempty(h1)){ ans = (rside-(rho*((v1^2)/2))-p1)/(rho*g); document.getelementbyid("h1").value = ans.tostring(); } else if (isempty(v1)){ ans = (rside-p1-(rho*g*h1))/rho; ans = ans*2; ans = math.sqrt(ans); document.getelementbyid("v1").value = ans.tostring(); } else if (isempty(p2)){ ans = lside-(rho*((v2^2)/2))-(rho*g*h2)-(rho*f); document.getelementbyid("p2").value = ans.tostring(); } else if (isempty(h2)){ ans = (lside-(rho*((v2^2)/2))-(rho*f)-p2)/(rho*g); document.getelementbyid("h2").value = ans.tostring(); } } </script> </body> </html> i trying calculations , have reply displayed in text box. if cannot done have tried display reply in
tag did not work either.
here code looks far: http://jsfiddle.net/fcxmt/238/
it supposed find text field left blank , calculation find value using other values given.
quickly went through code, id's assigned assigned div's , not input values themselves.you getting wrong id's can see.
var p1 = parseint(document.getelementbyid("p1").value); should
var p1 = parseint(document.getelementbyid("p1").value);//notice capital. i see divs contain input have id's not input fields themselves.
on line 76 have typo var text = document,getelementbyid(id).value; should document.getelementbyid(id).value;
javascript html input textfield
No comments:
Post a Comment