[英]How to display javascript results on the same page
我想知道是否有一种方法可以在同一个页面上的“计算”按钮下的文本字段中打印它，而不是使用警报功能来显示函数结果。 这是我到目前为止的内容：
<!DOCTYPE html> <html> <head> <title></title> <link rel="stylesheet" type="text/css" href="styles/formula_styles.css"> <script type="text/javascript"> var a,b,c; function setValues1() { a = Number(document.getElementById("a").value); b = Number(document.getElementById("b").value); c = Number(document.getElementById("c").value); } function and() { setValues1(); result1 = (-b + Math.sqrt(b*b -4*a*c))/(2*a); result2 = (-b - Math.sqrt(b*b -4*a*c))/(2*a); alert("The volume of this cube is " +result1 + " and " +result2); } </script> </head> <body> <nav> <a href="index.html">Home</a> // <a href="levels.html">Grade Levels</a> </nav> <div id="container"> <div id="formula"> <input type="text" id="a" placeholder="'A' Variable"/><br> <input type="text" id="b" placeholder="'B' Variable"/><br> <input type="text" id="c" placeholder="'C' Variable"/><br> <input type="button" onclick="and()" value="Calculate!"/> </div> </div> </body> </html>
在按钮下创建一个div并填充div的innerHTML ：
<!DOCTYPE html> <html> <head> <title></title> <link rel="stylesheet" type="text/css" href="styles/formula_styles.css"> <script type="text/javascript"> var a, b, c; function setValues1() { a = Number(document.getElementById("a").value); b = Number(document.getElementById("b").value); c = Number(document.getElementById("c").value); } function and() { setValues1(); result1 = (-b + Math.sqrt(b * b - 4 * a * c)) / (2 * a); result2 = (-b - Math.sqrt(b * b - 4 * a * c)) / (2 * a); document.getElementById('result').innerHTML = "The volume of this cube is " + result1 + " and " + result2; } </script> </head> <body> <nav> <a href="index.html">Home</a> // <a href="levels.html">Grade Levels</a> </nav> <div id="container"> <div id="formula"> <input type="text" id="a" placeholder="'A' Variable" /> <br> <input type="text" id="b" placeholder="'B' Variable" /> <br> <input type="text" id="c" placeholder="'C' Variable" /> <br> <input type="button" onclick="and()" value="Calculate!" /> <div id="result"> </div> </div> </div> </body> </html>
您可以通过设置要包含文本的元素来实现。
document.getElementById("result").innerHTML = "The volume of this cube is " +result1 + " and " + result2;
为此，您需要将元素设置为结果ID。
此行代码调用函数getElementByID来获取元素，该元素然后使您可以更改其innerHTML属性。
您分配给它的元素可以是您想要的任何元素。
在您的html中添加一个元素，如下所示：
<div id="results"></div>
然后，您可以按照以下方式执行一些操作，而不是使用警报：
document.getElementById("results").innerHTML = "The volume of this cube is " +result1 + " and " +result2;
无法使用 php 和 javascript 在同一页面上显示表单结果
[英]Can't display form results on same page with php and javascript
如何使用JavaScript在同一页面上显示多个错误消息
[英]How to display multiple error messages on the same page using JavaScript
如何使用html，javascript / jquery上传图像并将其显示在同一页面中
[英]How to upload an image and display it in the same page using html, javascript / jquery
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.