<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
table {
background-color: #CD5C5C;
}
</style>
</head>
<body bgcolor="#B0C4DE">
<table style="margin: 0 auto;" border="1">
<h1 align="center">Table Generator</h1>
<tr>
<td>Enter Table Number</td>
<td><input id="table_number"></td>
</tr>
<tr>
<td>Enter Table Length</td>
<td><input id="table_length"></td>
</tr>
</table>
<p style="text-align: center;"><button onclick="generateTable();">Generate</button></p>
<table style="margin: 0 auto;" border="1">
<tr>
<td>Enter Even Values</td>
<td><input id="even_value" readonly></td>
</tr>
<tr>
<td>Enter Odd Values</td>
<td><input id="odd_value" readonly></td>
</tr>
<tr>
<td colspan="2">
<textarea cols="38" rows="20" id="show_table" readonly></textarea>
</td>
</tr>
</table>
</body>
<script type="text/javascript">
function generateTable(){
var tableNumber = parseInt(document.getElementById("table_number").value);
var tableLength = parseInt(document.getElementById("table_length").value);
// Displaying the value
if (tableNumber < 0) {
alert("Invalid Input");
}
var even_value = 0;
var odd_value = 0;
var table_vals="";
var evenodd = "";
for (var i = 1; i <= tableLength; i++) {
var table = tableNumber + " x " + i + " = " + tableNumber * i + "\n";
evenodd = tableNumber * i;
if (evenodd%2 == 0) {
even_value++;
} else {
odd_value++;
}
table_vals += table;
}
document.getElementById("show_table").value = table_vals;
document.getElementById("even_value").value = even_value;
document.getElementById("odd_value").value = odd_value;
}
</script>
</html>
Sunday, 12 January 2020
Subscribe to:
Comments (Atom)
-
<!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> table { ...
