Create static/script.js

static/script.js

@@ -0,0 +1,74 @@
+document.addEventListener('DOMContentLoaded', function() {
+    const convertForm = document.getElementById('convertForm');
+    const resultCard = document.getElementById('resultCard');
+    const convertResult = document.getElementById('convertResult');
+    const copyBtn = document.getElementById('copyBtn');
+    const toast = document.getElementById('toast');
+    
+    // 表单提交事件
+    convertForm.addEventListener('submit', function(e) {
+        e.preventDefault();
+        
+        // 获取表单数据
+        const formData = new FormData(convertForm);
+        
+        // 显示加载提示
+        showToast('正在处理，请稍候...');
+        
+        // 发送 AJAX 请求
+        fetch('/convert', {
+            method: 'POST',
+            body: formData
+        })
+        .then(response => response.json())
+        .then(data => {
+            if (data.status === 'success') {
+                // 显示结果
+                convertResult.value = data.result;
+                resultCard.style.display = 'block';
+                
+                // 滚动到结果区域
+                resultCard.scrollIntoView({ behavior: 'smooth' });
+            } else {
+                showToast('错误: ' + data.message, 'error');
+            }
+        })
+        .catch(error => {
+            showToast('请求失败: ' + error, 'error');
+        });
+    });
+    
+    // 复制按钮事件
+    copyBtn.addEventListener('click', function() {
+        convertResult.select();
+        document.execCommand('copy');
+        
+        // 不选中文本
+        window.getSelection().removeAllRanges();
+        
+        showToast('已复制到剪贴板！');
+    });
+    
+    // 显示提示消息
+    function showToast(message, type = 'info') {
+        toast.textContent = message;
+        toast.className = 'toast show ' + type;
+        
+        // 3秒后隐藏
+        setTimeout(function() {
+            toast.className = 'toast';
+        }, 3000);
+    }
+    
+    // 输入框聚焦动画
+    const inputs = document.querySelectorAll('input, textarea, select');
+    inputs.forEach(input => {
+        input.addEventListener('focus', function() {
+            this.parentElement.classList.add('focused');
+        });
+        
+        input.addEventListener('blur', function() {
+            this.parentElement.classList.remove('focused');
+        });
+    });
+});