You can create a simple HTML page with JavaScript that converts octal to hexadecimal without using a submit button. The conversion can happen dynamically as the user inputs the octal value. Here’s an example:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Octal to Hexadecimal Converter</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 20px;
}
label {
display: block;
margin-bottom: 8px;
}
input {
width: 100%;
padding: 8px;
box-sizing: border-box;
}
p {
margin-top: 16px;
}
</style>
</head>
<body>
<h2>Octal to Hexadecimal Converter</h2>
<label for="octalInput">Enter Octal Number:</label>
<input type="text" id="octalInput" placeholder="Enter octal number" oninput="convertOctalToHex()">
<p id="hexResult"></p>
<script>
function convertOctalToHex() {
// Get the octal input value
const octalInput = document.getElementById('octalInput').value;
// Check if the input is a valid octal number
if (!/^[0-7]+$/.test(octalInput)) {
document.getElementById('hexResult').innerHTML = 'Invalid octal number';
return;
}
// Convert octal to decimal, then decimal to hexadecimal
const decimalValue = parseInt(octalInput, 8);
const hexValue = decimalValue.toString(16).toUpperCase();
// Display the result
document.getElementById('hexResult').innerHTML = `Hexadecimal: 0x${hexValue}`;
}
</script>
</body>
</html>
This HTML file includes an input field for entering an octal number, and as the user types, the `convertOctalToHex` function is triggered on the `oninput` event. The function validates if the input is a valid octal number and then converts it to hexadecimal, displaying the result dynamically on the page.