document.getElementById("areatext").setAttribute("value",area);似乎不會更新
阿新 • • 發佈:2018-12-19
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>圓面積</title> <script type="text/javascript" src="area.js"></script> <style type="text/css"> .circle{ border:5px solid #FF6A6A; background: #ADD8E6; width: 500px; height: 300px; margin: 120px 400px; } h3{ text-align: center; margin-top: 40px; } p{ margin: 20px 110px; } .button{ width: 250px; height: 30px; margin:40px 110px; } .button1{ width:50px; margin-left: 50px; } .button2{ width:50px; margin-left: 40px; } </style> </head> <body> <form class="circle" id="form1" name="form1" method="post"> <h3>計算圓的面積</h3><br> <p>輸入半徑:<input type="text" id="radiustext" name="radiustext"></p> <p>圓的面積:<input type="text" id="areatext" name="areatext" readonly="readonly"></p> <div class="button"> <a href="#" onclick="show();return false;"><input class="button1" type="button" value="計算"></a> <a href="#" onclick="reset();"><input class="button2" type="button" value="清空"></a> </div> </form> </body> </html>
function show() { //通過 ID 獲取半徑文字框的輸入值並轉換為浮點數 var radius = parseFloat(document.getElementById("radiustext").value); // console.log(document.getElementById("radiustext").value); var area = Math.PI * radius * radius; console.log(area); //document.getElementById("areatext").setAttribute("value",area); document.getElementById("areatext").value = area; console.log( document.getElementById("areatext").value); return; }; function reset(){ document.getElementById("radiustext").value=""; document.getElementById("areatext").value=""; return; };