0
我有一个简单的HTML5，它是一个计算器。 我填写该字段并点击提交。脚本运行会生成表格，如您在调试屏幕截图中所看到的，然后下一步再次返回页面，表格填充且没有表格。函数返回后表格动态创建表丢失
我试过的脚本后，返回false，但JavaScript的返回后，调试追溯到标签按钮，并调用似乎到Chrome浏览器的一个javascript它不工作根据需要...
...
此行为Chorme hapening 47.0.2526.106老了IE9女巫是我这里测试的浏览器...
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="description" content="">
<meta name="author" content="">
<title>Calculadora</title>
</head>
<body>
<div class="jumbotron">
<form class="form-horizontal" method="post" >
<fieldset>
<!-- Form Name -->
<legend>Calculadora</legend>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" for="val_inicial">Valor Inicial</label>
<div class="col-md-4">
<input id="val_inicial" name="val_inicial" type="text" placeholder="Valor Inicial" class="form-control input-md" required="">
<span class="help-block">Type here your initial deposit</span>
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" for="val_perio">Valor de aplicação periódica</label>
<div class="col-md-4">
<input id="val_perio" name="val_perio" type="text" placeholder="Valor Recorrente" class="form-control input-md" required="">
<span class="help-block">Type here your recorrent deposit</span>
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" for="taxa_mensal">Taxa de rendimento mensal</label>
<div class="col-md-4">
<input id="taxa_mensal" name="taxa_mensal" type="text" placeholder="Taxa Mensal" class="form-control input-md" required="">
<span class="help-block">Type here the expected return tax</span>
</div>
</div>
<!-- Text input-->
<div class="form-group">
<label class="col-md-4 control-label" for="num_periodos">Número de Períodos</label>
<div class="col-md-4">
<input id="num_periodos" name="num_periodos" type="text" placeholder="Número de Períodos" class="form-control input-md" required="">
<span class="help-block">Type here the number of periods for your calculations</span>
</div>
</div>
<!-- Button -->
<div class="form-group">
<label class="col-md-4 control-label" for="btn_calcular"></label>
<div class="col-md-4">
<button id="btn_calcular" name="btn_calcular" class="btn btn-primary" onclick="calcular();">Calcular</button>
</div>
</div>
<!-- Label -->
<div class="form-group" id="div_resultado" style="visibility:hidden;">
<label class="col-md-4 control-label" for="total">Valor Calculado</label>
<div class="col-md-4">
<input id="total" name="total" type="text" placeholder="Valor Calculado" class="form-control input-md" >
</div>
</div>
</fieldset>
</form>
</div>
<div class="row marketing">
<div class="col-lg-6" id="tableDiv">
<table border="1" id="resultado">
<thead>
<th>Período</th>
<th>Taxa</th>
<th>Saldo anterior</th>
<th>Aplicação</th>
<th>Saldo posterior</th>
</thead>
</table>
</div>
</div>
<footer class="footer">
<p>© 2015 Company, Inc.</p>
</footer>
<script src="./fatAcc.js" type="text/javascript"></script>
</body>
</html>
和JavaScript fatAcc.js
function operadorCantoneira(i, t) {
var iPercent = i/100;
var resultado = (Math.pow(1+iPercent, t)-1)/iPercent;
return resultado.toFixed(5);
}
function calcular() {
var i = document.getElementById('taxa_mensal').value;
var t = document.getElementById('num_periodos').value;
var valorInicial = document.getElementById('val_inicial').value
var valorRecorrente = document.getElementById('val_perio').value
var valorCalculadoInicial = valorInicial * i/100;
var valorCalculado = valorCalculadoInicial * operadorCantoneira(i, t-1);
document.getElementById('total').value = valorCalculado.formatMoney(2,',', '.');
document.getElementById('div_resultado').style.visibility='visible';
geraTabelaResultadosMensais();
return false;
}
Number.prototype.formatMoney = function(c, d, t){
var n = this,
c = isNaN(c = Math.abs(c)) ? 2 : c,
d = d == undefined ? "." : d,
t = t == undefined ? "," : t,
s = n < 0 ? "-" : "",
i = parseInt(n = Math.abs(+n || 0).toFixed(c)) + "",
j = (j = i.length) > 3 ? j % 3 : 0;
return s + (j ? i.substr(0, j) + t : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + t) + (c ? d + Math.abs(n - i).toFixed(c).slice(2) : "");
};
function geraTabelaResultadosMensais(){
//var tableDiv = document.getElementById('tableDiv');
var table = document.getElementById('resultado');
var t = Number(document.getElementById('num_periodos').value);
var i = Number(document.getElementById('taxa_mensal').value);
var valorInicial = Number(document.getElementById('val_inicial').value);
var valorRecorrente = Number(document.getElementById('val_perio').value);
var valorAcumulado = valorInicial;
//PRIMEIRA LINHA
var row = table.insertRow();
var cell1 = row.insertCell();
var cell2 = row.insertCell();
var cell3 = row.insertCell();
var cell4 = row.insertCell();
var cell5 = row.insertCell();
cell1.innerHTML = 1;
cell2.innerHTML = i;
cell3.innerHTML = valorInicial;
cell4.innerHTML = valorRecorrente;
valorAcumulado = valorInicial * (1+i/100);
cell5.innerHTML = valorAcumulado.formatMoney(2,',', '.');
//O RESTANTE DAS LINHAS
for(var tempT=2; tempT<=t; tempT++){
row = table.insertRow();
cell1 = row.insertCell();
cell2 = row.insertCell();
cell3 = row.insertCell();
cell4 = row.insertCell();
cell5 = row.insertCell();
cell1.innerHTML = tempT;
cell2.innerHTML = i;
cell3.innerHTML = valorAcumulado.formatMoney(2,',', '.');
cell4.innerHTML = valorRecorrente.formatMoney(2,',', '.');
valorAcumulado = (Number(valorAcumulado) + Number(valorRecorrente))*(1 + i/100);
cell5.innerHTML = valorAcumulado.formatMoney(2,',', '.');
}
tableDiv.appendChild(table);
return false;
}