<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>TET71 Tilgungsrechner</title>
</head>
<body>
<font face="Arial" color="">
<h1 class="text"> Tilgungsrechner</h1>
<form id="eingabe">
Kredithöhe
<br>
<br>
<input id="kredithöhe" class="eingabe" type="text" value="">€
<br>
<br>
Laufzeit
<br>
<input type="range" id="laufzeit" class="eingabe" value="" min="5" max="50">
<output id="output" for="volume"></output> Jahre
<br>
Rate
<br>
<br>
<input id="rate" class="eingabe" type="number" min="0" max="1000000" step="10">€
<br>
<br>
Zinssatz
<br>
<br>
<input id="zinssatz" class="eingabe" type="text" value"">%
<br>
<br>
Auszahlungsdatum
<br>
<br>
<input type="date" name="Datum" value="2018-03-22">
<br>
<br>
</form>
<input id="btn1" class="btn rechnen" type="submit" value="Berechnen" onclick='rechnen();'>
<input id="btn2" class="btn reset" type="submit" form="eingabe" value="Reset" onclick='reset();'>
<br>
<br>
Restschuld:
<br>
<input id="restschuld" type="text" value"">€
<br>
Gesamte Tilgung:
<br>
<input id="gesamttilgung" type="text" value"">€
<br>
Gesamte Zinsen:
<br>
<input id="gesamtzinsen" type="text" value"">€
<br>
<br>
</>
<TABLE align="center" BORDER="2" BORDERCOLOR="#000000" BORDERCOLORLIGHT="#66FFFF">
<TR> <TR>
<TD>1A <TD>1B
</TD> </TD>
</TR> </TR>
<TR> <TR>
<TD>2A <TD>2B
</TD> </TD>
</TR> </TR>
</TABLE>
</font>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js'></script>
<script src="js/index.js"></script>
</body>
</html>
/*Downloaded from https://www.codeseek.co/-dennis-/tet71-tilgungsrechner-MVmLwX */
//SLIDER
function ausgeben(ev) {
document.getElementById('output').value = ev.target.value;
}
document.getElementById('laufzeit').addEventListener('input', ausgeben)
//SLIDER ENDE
//Button 1 ausgrauen/einblenden
/*//Button 1 Eingabefelder freigabe
$('#btn1').prop('disabled', true);
function checkEingabe() {
allesAusgefuellt = true; // Annahme alle Felder sind ok
$(".eingabe").each(function() { // Durchsuche alle Felder
eingabe = $(this).val(); // lese den Wert des jeweiligen Feldes auf eingabe
if (eingabe == "") { // Prüfe ob Eingabe leer ist
allesAusgefuellt = false; // Annahme alle Felder sind leer ist falsch
}
});
$("#btn1").prop("disabled", !allesAusgefuellt); // Disable wenn nicht alles ausgefüllt
}
//Button 1 Freigabe ENDE
*/
document.getElementById('btn1').enable = (document.getElementByclass('eingabe').value.length==5);
//Button 2 ausgrauen/einblenden
$('#btn2').prop('disabled', true);
$('.eingabe').keyup(function()
{
console.log($(this).val())
if( $(this).val() ) {
$('#btn2').prop('disabled', false);
}
if( !$(this).val() ) {
$('#btn2').prop('disabled', true);
}
});
Bootstrap
Angular
ReactJS
jQuery
VueJS
HTML
CSS
JavaScript
jQuery
v3.3.1
