Certainly! Below is a simple example of a real-time multiplication table generator in JavaScript. The user can enter a number, and the script will display the multiplication table for that number.
You can use this code in an HTML file with embedded JavaScript:
HTML + JavaScript
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Multiplication Table</title>
<style>
body {
font-family: Arial, sans-serif;
text-align: center;
margin-top: 50px;
}
input {
padding: 8px;
font-size: 16px;
margin-bottom: 20px;
}
button {
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
}
.result {
margin-top: 20px;
font-size: 18px;
white-space: pre-wrap;
}
</style>
</head>
<body>
<h2>Multiplication Table Generator</h2>
<input type="number" id="number" placeholder="Enter a number" />
<button onclick="generateTable()">Generate Table</button>
<div class="result" id="result"></div>
<script>
function generateTable() {
const number = document.getElementById("number").value;
const resultDiv = document.getElementById("result");
if (number === "") {
resultDiv.innerHTML = "Please enter a number!";
return;
}
let table = `<h3>Multiplication Table for ${number}:</h3>`;
for (let i = 1; i <= 10; i++) {
table += `${number} x ${i} = ${number * i}<br>`;
}
resultDiv.innerHTML = table;
}
</script>
</body>
</html>
How it works
User Input: The user enters a number in the input field.
Button Click: When the "Generate Table" button is clicked, the generateTable function is executed.
Multiplication Logic: The function multiplies the entered number with numbers from 1 to 10 and shows the results below the button.
Output: The multiplication table is displayed dynamically.
Features
Responsive design for different screen sizes.
Shows results in a neat format.
Provides real-time interaction without page reload.
Example
If the user enters 5 and clicks "Generate Table," the output would look like this:
Multiplication Table for 5:
5 x 1 = 5
5 x 2 = 10
5 x 3 = 15
5 x 4 = 20
5 x 5 = 25
5 x 6 = 30
5 x 7 = 35
5 x 8 = 40
5 x 9 = 45
5 x 10 = 50