51 lines
2.1 KiB
HTML
51 lines
2.1 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<title>ID Formatter</title>
|
||
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
||
|
|
<style>
|
||
|
|
body {
|
||
|
|
font-family: 'Inter', sans-serif;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body class="bg-gray-100 flex items-center justify-center min-h-screen">
|
||
|
|
|
||
|
|
<div class="max-w-2xl w-full bg-white p-6 rounded-lg shadow-lg">
|
||
|
|
<h1 class="text-3xl font-bold text-center mb-6">ID Formatter</h1>
|
||
|
|
<div class="mb-4">
|
||
|
|
<label for="inputText" class="block text-lg font-medium text-gray-700 mb-2">Input Text</label>
|
||
|
|
<textarea id="inputText" rows="6" class="w-full p-4 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Enter your text here..."></textarea>
|
||
|
|
</div>
|
||
|
|
<div class="mb-6">
|
||
|
|
<label for="outputText" class="block text-lg font-medium text-gray-700 mb-2">Output Text</label>
|
||
|
|
<textarea id="outputText" rows="6" readonly class="w-full p-4 border border-gray-300 rounded-lg bg-gray-50"></textarea>
|
||
|
|
</div>
|
||
|
|
<div class="text-center">
|
||
|
|
<button onclick="formatText()" class="bg-blue-500 text-white py-2 px-6 rounded-lg shadow hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500">Format IDs</button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
function formatText() {
|
||
|
|
const inputText = document.getElementById('inputText').value;
|
||
|
|
const outputText = document.getElementById('outputText');
|
||
|
|
|
||
|
|
// Regular expression to find 7-digit numbers
|
||
|
|
const regex = /\b\d{7}\b/g;
|
||
|
|
const matches = inputText.match(regex);
|
||
|
|
|
||
|
|
// Format matches with quotes and commas
|
||
|
|
if (matches) {
|
||
|
|
const formattedMatches = matches.map(num => `"${num}",`).join('\n');
|
||
|
|
outputText.value = formattedMatches;
|
||
|
|
} else {
|
||
|
|
outputText.value = 'No 7-digit numbers found.';
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|