mirror of
https://github.com/ChenKaiLiuG/find_your_own_fxxking_problem.git
synced 2026-06-17 16:54:24 +00:00
44 lines
1.2 KiB
HTML
44 lines
1.2 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>逐字顯示</title>
|
|
<style>
|
|
#output {
|
|
font-size: 2em;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="output"></div>
|
|
<script>
|
|
async function loadAndDisplay() {
|
|
try {
|
|
const response = await fetch('/get_file_content');
|
|
if (!response.ok) {
|
|
throw new Error(`HTTP error! status: ${response.status}`);
|
|
}
|
|
const text = await response.text();
|
|
let index = 0;
|
|
const outputDiv = document.getElementById('output');
|
|
|
|
function displayNextChar() {
|
|
if (index < text.length) {
|
|
outputDiv.textContent += text[index];
|
|
index++;
|
|
setTimeout(displayNextChar, 1000); // 每秒顯示一個字
|
|
}
|
|
}
|
|
|
|
displayNextChar();
|
|
|
|
} catch (error) {
|
|
console.error('無法載入檔案內容:', error);
|
|
document.getElementById('output').textContent = '無法載入檔案內容。';
|
|
}
|
|
}
|
|
|
|
window.onload = loadAndDisplay;
|
|
</script>
|
|
</body>
|
|
</html>
|