如何替換按鈕上的表格點擊

我目前在我的網頁設計類入門課上有作業分配問題。這是JavaScript分配的介紹。分配的要點是計算折舊。我們有輸入資產價值，資產壽命和打撈價值的字段。還有一個標有「計算」的按鈕，該按鈕運行公式來計算直線折舊，然後生成具有正確結果的表格。我的問題來自多次點擊計算按鈕。當再次點擊時，我的程序會在原件下方打印更多行，並且只要點擊計算就會繼續。我想要發生的是，每次計算都會被點擊，破壞原始表格，並重新打印另一個表格。我只是不知道該怎麼做。任何幫助表示讚賞。如何替換按鈕上的表格點擊

<!DOCTYPE html> 
<html> 
<head> 
<style> 

</style> 
<meta charset="ISO-8859-1"> 
<title>Homework 4</title> 
<script type="text/javascript"> 
function calculateAndDisplay() { 
    var table = document.getElementById("depreciationTable"); 
    var assetValueInput = document.getElementById("asset_value").value; 
    var assetLifeInput = document.getElementById("asset_life").value; 
    var salvageValueInput = document.getElementById("salvage_value").value; 
    var year; 
    var assetValue = assetValueInput; 
    var assetLife = assetLifeInput; 
    var salvageValue = salvageValueInput; 

    assetValue = assetValue - salvageValue; 
    var depreciation = assetValue/assetLife; 
    var accumulatedDepreciation = 0; 
    var i; 
    for(i=0; i < assetLifeInput; i++){ 
    year = i + 1; 
    assetValue = assetValue - depreciation; 
    accumulatedDepreciation = accumulatedDepreciation + depreciation; 
    var row = table.insertRow(-1); 
    var cell1 = row.insertCell(0); 
    var cell2 = row.insertCell(1); 
    var cell3 = row.insertCell(2); 
    var cell4 = row.insertCell(3); 
    if (year % 2 === 0){ 
     cell1.innerHTML = year; 
     cell1.style.backgroundColor = "#ADD8E6"; 
     cell2.innerHTML = parseFloat(Math.round(assetValue * 100)/100).toFixed(2); 
     cell2.style.backgroundColor = "#ADD8E6"; 
     cell3.innerHTML = parseFloat(Math.round(depreciation * 100)/100).toFixed(2); 
     cell3.style.backgroundColor = "#ADD8E6"; 
     cell4.innerHTML = parseFloat(Math.round(accumulatedDepreciation * 100)/100).toFixed(2); 
     cell4.style.backgroundColor = "#ADD8E6"; 
    }else{ 


    cell1.innerHTML = year; 
    cell2.innerHTML = parseFloat(Math.round(assetValue * 100)/100).toFixed(2); 
    cell3.innerHTML = parseFloat(Math.round(depreciation * 100)/100).toFixed(2); 
    cell4.innerHTML = parseFloat(Math.round(accumulatedDepreciation * 100)/100).toFixed(2); 
    } 
    } 


} 
</script> 
</head> 
<body> 
Asset Value: <input id="asset_value" type="text"/> 
Asset Life: <input id="asset_life" type="text" /> 
Salvage Value: <input id="salvage_value" type="text"/> 
<button onclick="calculateAndDisplay()">Calculate</button> 
<table id="depreciationTable"> 
    <tr bgcolor= "#00008B"> 
    <td><font color="white">Year</font></td> 
    <td><font color="white">Asset Value</font></td> 
    <td><font color="white">Depreciation</font></td> 
    <td><font color="white">Accumulated Depreciation</font></td> 

    </tr> 

</table> 
<br> 
</body> 
</html>

來源

2015-04-16 zimgir99

您的代碼不會「在原稿下面打印另一張表格」。它只是在表格中添加一行。 –

對不起，我的無知。你是對的 – zimgir99

裹在一個ID或獨特的類，然後可以用它來改變的innerHTML ......在HTML中是新表去一個div表;覆蓋那裏的桌子。

來源

2015-04-16 01:32:33 rfornal

如何替換按鈕上的表格點擊

回答

相關問題