2012-04-13 6 views
0

У меня есть две проблемы, которые я не смог выяснить. Я использую javascript для расчета сложных процентов. Моя формула для расчета интереса работает, но мне нужно, чтобы график после расчётов показывался в виде табличной процентной ставки (чтобы показывать период за периодом сумму начисленных каждый раз), а затем итоговую общую и общую сумму процентов. Это то, что мой код выглядит следующим образом:AppendChild and for loop issue

<head> 
    <title></title> 
<script type="text/javascript"> 
    function rateSched(amnt, prd, rte, namt) { 
     for (i = 0; i < periods; i++) { 
      if (!document.getElementsByTagName) return; 
      tabBody = document.getElementsByTagName("tbody").item(0); 
      row = document.createElement("tr"); 
      cell1 = document.createElement("td"); 
      cell2 = document.createElement("td"); 
      cell3 = document.createElement("td"); 
      cell4 = document.createElement("td"); 
      textnode1 = document.createTextNode(amnt); 
      textnode2 = document.createTextNode(prd); 
      textnode3 = document.createTextNode(rte); 
      textnode4 = document.createTextNode(namt); 
      cell1.appendChild(textnode1); 
      cell2.appendChild(textnode2); 
      cell3.appendChild(textnode3); 
      cell4.appendChild(textnode4); 
      row.appendChild(cell1); 
      row.appendChild(cell2); 
      row.appendChild(cell3); 
      row.appendChild(cell4); 
      tabBody.appendChild(row); 
     } 
    } 
    var deposit; 
    var periods; 
    var interest; 
    var newamount = deposit * (Math.pow(1 + interest, periods) - 1)/interest; 
    var i=0; 

    function calcAmt(form1) { 
     deposit = form1.dp.value; 
     interest = form1.rt.value; 
     periods = form1.pr.value; 
     form1.amt.value = Math.round(deposit * (Math.pow((1 + interest/100), periods)) * 100)/100; 
     form1.intr.value = Math.round((deposit * (Math.pow((1 + interest/100), periods)) - deposit) * 100)/100 
    } 
</script> 
</head> 
<body> 
<center> 
    <form method="get" name="form1" onreset="form1.dp.focus()"> 

    <table border="5" bgcolor="#BDBDBD" cellpadding="2" width="300px"> 
    <tr><td colspan="2" align="center"> 
    <b><font size="5" color="#4B088A">Compound Interest</font></b> 
    </td></tr> 

    <tr><td align="right">Initial Deposit</td><td> 
    <input type="text" name="dp" value=""/></td></tr> 

    <tr><td align="right">Interest Rate (% Value)</td><td> 
    <input type="text" name="rt" value=""/></td></tr> 

    <tr><td align="right">Periods</td><td> 
    <input type="text" name="pr" value=""/></td></tr> 

    <tr><td align="right">Final Amount</td><td> 
    <input type="text" name="amt" value=""/></td></tr> 

    <tr><td align="right">Total Interest</td><td> 
    <input type="text" name="intr" value=""/></td></tr> 

    <tr><td> 
    <input type="button" name="calc" value="Calculate" size="13" onclick="calcAmt(form1);rateSched(deposit,interest,i,newamount);return false;"/></td> 

    <td></td></tr> 
    </table> 
    </form> 

    <br /> 

    <table border='1' width="300px"> 
    <tbody> 
    <tr><td>Amount</td><td>Period</td><td>Rate</td><td>New Amount</td></tr> 
    </tbody> 
    </table> 

    <br /> 

    <table> 
    <tr><td align="right">Final Amount</td><td> 
    <input type="text" name="amt" value="" size="13"/></td></tr> 

    <tr><td align="right">Total Interest</td><td> 
    <input type="text" name="intr" value="" size="13"/></td></tr> 
    </table> 

    </center> 
</body> 
</html> 

Мои проблемы в том, что новые строки таблицы должны быть добавлены к нижней, четыре столбца таблицы вместо верхней, они должны показывать каждый период, как она идет вместо тождественны столбцы, а нижняя «Конечная сумма» и «Общий интерес» не заполняются с помощью onclick.

Edit: Последняя версия коды имеют проблем с, как описано в комментариях:

function calcAmt(form1) { 
    var newamount = deposit * (Math.pow(1 + interest, periods) - 1)/interest; 
    deposit = form1.dp.value; 
    interest = form1.rt.value; 
    periods = form1.pr.value; 
    form1.amt.value = Math.round(deposit * (Math.pow((1 + interest/100), periods)) * 100)/100; 
    form1.intr.value = Math.round((deposit * (Math.pow((1 + interest/100), periods)) - deposit) * 100)/100 
} 

ответ

1

Чтобы настроить таргетинг на правильный tbody тега, вы должны поставить идентификатор на нем и document.getElementById("xxx") как это гарантирует вы получите право один, не полагаясь на определенный индекс позиции в вашем документе HTML.

FYI, все таблицы имеют тег tbody независимо от того, находится ли он в вашем HTML-коде или нет.

Вы можете увидеть, как я использую document.getElementById("results"), чтобы получить результаты, идущие в правой таблице здесь: http://jsfiddle.net/jfriend00/MqMtd/

Кроме того, все переменные внутри функции, которые вы собираетесь быть локальные переменные (не Globals) должны иметь вар перед из них. Вы используете много неявных глобалов (переменные никогда не объявлялись явно), что является очень плохой практикой.

Значение newAmount не действует, так как код, который инициализирует его работает до переменных, от которых зависит заполняет. Я хотел бы предложить вам установить значение newAmount в calcAmt(), где другие значения, это зависит от установлены ,

+0

Это сделало, спасибо. – user1330759

+0

По какой-то причине, когда я пытаюсь установить значение newAmount в calcAmt(), моя таблица больше не добавляется. Вы знаете, почему это может произойти? – user1330759

+0

@ user1330759 - вы предположительно вызываете ошибку javascript с недопустимым кодом, и это прекращает выполнение. Я не могу дать рекомендации о том, какова конкретная проблема, не видя точного кода. – jfriend00