[英]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.