对前引号后引号搞歪了的问题进行快速修复
由豆包生成。
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>引号修复工具</title> <script src="https://cdn.tailwindcss.com"></script> <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet"> <!-- 配置Tailwind自定义主题 --> <script> tailwind.config = { theme: { extend: { colors: { primary: '#3B82F6', secondary: '#10B981', }, } } } </script> </head> <body class="bg-gray-50 text-gray-800 m-0 p-0"> <!-- 主要内容区 --> <main class="container mx-auto p-4"> <!-- 工具区域 --> <div class="grid grid-cols-1 lg:grid-cols-2 gap-6"> <!-- 输入区域 --> <div class="bg-white rounded-lg shadow-sm border border-gray-100"> <div class="bg-primary text-white px-4 py-2 text-sm font-medium"> <i class="fa fa-pencil mr-1"></i>输入文本 </div> <div class="p-4"> <textarea id="inputText" class="w-full h-48 p-3 border border-gray-200 rounded focus:ring-1 focus:ring-primary focus:border-primary outline-none text-sm resize-none" placeholder="请输入需要修复引号的文本..."></textarea> <div class="mt-3 flex gap-2 flex-wrap"> <button id="fixButton" class="bg-primary hover:bg-primary/90 text-white px-4 py-1.5 rounded text-sm transition-colors flex items-center"> <i class="fa fa-magic mr-1"></i>修复 </button> <button id="clearButton" class="bg-gray-200 hover:bg-gray-300 text-gray-700 px-4 py-1.5 rounded text-sm transition-colors flex items-center"> <i class="fa fa-trash mr-1"></i>清空 </button> <button id="pasteButton" class="bg-gray-200 hover:bg-gray-300 text-gray-700 px-4 py-1.5 rounded text-sm transition-colors flex items-center"> <i class="fa fa-clipboard mr-1"></i>粘贴 </button> </div> </div> </div> <!-- 输出区域 --> <div class="bg-white rounded-lg shadow-sm border border-gray-100"> <div class="bg-secondary text-white px-4 py-2 text-sm font-medium"> <i class="fa fa-check mr-1"></i>修复结果 </div> <div class="p-4"> <div id="outputText" class="w-full h-48 p-3 border border-gray-200 rounded bg-gray-50 overflow-auto text-sm"> <div class="text-gray-400 text-center h-full flex items-center justify-center"> 修复后的文本将显示在这里 </div> </div> <!-- 用于复制的隐藏文本区域 --> <textarea id="copyHelper" class="hidden"></textarea> <div class="mt-3 flex gap-2"> <button id="copyButton" class="bg-secondary hover:bg-secondary/90 text-white px-4 py-1.5 rounded text-sm transition-colors flex items-center" disabled> <i class="fa fa-copy mr-1"></i>复制 </button> <button id="swapButton" class="bg-gray-200 hover:bg-gray-300 text-gray-700 px-4 py-1.5 rounded text-sm transition-colors flex items-center" disabled> <i class="fa fa-exchange mr-1"></i>交换 </button> </div> <div id="stats" class="mt-2 text-xs text-gray-500 hidden"> <p> <i class="fa fa-info-circle mr-1"></i> 修复统计: <span id="doubleQuotesFixed" class="font-medium">0</span> 组双引号, <span id="singleQuotesFixed" class="font-medium">0</span> 组单引号 </p> </div> </div> </div> </div> </main> <!-- 通知提示 --> <div id="notification" class="fixed bottom-4 right-4 bg-gray-800 text-white px-4 py-2 rounded text-sm shadow-lg transform translate-y-20 opacity-0 transition-all duration-300 flex items-center"> <i id="notificationIcon" class="fa fa-check-circle mr-2"></i> <span id="notificationText">操作成功</span> </div> <script> // 引号修复核心功能 - 保持原引号样式，只修复匹配 function fixQuotes(text) { let result = text.split(''); let doubleQuotesCount = 0; let singleQuotesCount = 0; let inDoubleQuote = false; let inSingleQuote = false; let doubleQuoteType = null; // 记录双引号类型："rounded" 或 "square" let singleQuoteType = null; // 记录单引号类型："rounded" 或 "square" // 定义引号类型 const roundedDoubleOpen = '“'; const roundedDoubleClose = '”'; const squareDoubleOpen = '「'; const squareDoubleClose = '」'; const roundedSingleOpen = '‘'; const roundedSingleClose = '’'; const squareSingleOpen = '『'; const squareSingleClose = '』'; for (let i = 0; i < result.length; i++) { const char = result[i]; // 处理双引号 if (char === roundedDoubleOpen || char === roundedDoubleClose || char === squareDoubleOpen || char === squareDoubleClose) { // 确定引号类型 if (doubleQuoteType === null) { doubleQuoteType = (char === roundedDoubleOpen || char === roundedDoubleClose) ? 'rounded' : 'square'; } if (!inDoubleQuote) { // 第一个引号，改为前引号 result[i] = doubleQuoteType === 'rounded' ? roundedDoubleOpen : squareDoubleOpen; inDoubleQuote = true; } else { // 第二个引号，改为后引号 result[i] = doubleQuoteType === 'rounded' ? roundedDoubleClose : squareDoubleClose; inDoubleQuote = false; doubleQuotesCount++; } } // 处理单引号 else if (char === roundedSingleOpen || char === roundedSingleClose || char === squareSingleOpen || char === squareSingleClose) { // 确定引号类型 if (singleQuoteType === null) { singleQuoteType = (char === roundedSingleOpen || char === roundedSingleClose) ? 'rounded' : 'square'; } if (!inSingleQuote) { // 第一个引号，改为前单引号 result[i] = singleQuoteType === 'rounded' ? roundedSingleOpen : squareSingleOpen; inSingleQuote = true; } else { // 第二个引号，改为后单引号 result[i] = singleQuoteType === 'rounded' ? roundedSingleClose : squareSingleClose; inSingleQuote = false; singleQuotesCount++; } } } return { fixedText: result.join(''), doubleQuotesFixed: doubleQuotesCount, singleQuotesFixed: singleQuotesCount }; } // DOM元素 const inputText = document.getElementById('inputText'); const outputText = document.getElementById('outputText'); const copyHelper = document.getElementById('copyHelper'); const fixButton = document.getElementById('fixButton'); const clearButton = document.getElementById('clearButton'); const copyButton = document.getElementById('copyButton'); const swapButton = document.getElementById('swapButton'); const pasteButton = document.getElementById('pasteButton'); const notification = document.getElementById('notification'); const notificationText = document.getElementById('notificationText'); const notificationIcon = document.getElementById('notificationIcon'); const stats = document.getElementById('stats'); const doubleQuotesFixed = document.getElementById('doubleQuotesFixed'); const singleQuotesFixed = document.getElementById('singleQuotesFixed'); // 显示通知 function showNotification(message, isSuccess = true) { notificationText.textContent = message; notificationIcon.className = isSuccess ? 'fa fa-check-circle mr-2' : 'fa fa-exclamation-circle mr-2 text-red-400'; notification.classList.remove('translate-y-20', 'opacity-0'); notification.classList.add('translate-y-0', 'opacity-100'); setTimeout(() => { notification.classList.remove('translate-y-0', 'opacity-100'); notification.classList.add('translate-y-20', 'opacity-0'); }, 2000); } // 修复引号 fixButton.addEventListener('click', () => { const text = inputText.value.trim(); if (!text) { showNotification('请输入需要修复的文本', false); return; } // 添加按钮加载效果 fixButton.disabled = true; fixButton.innerHTML = '<i class="fa fa-spinner fa-spin mr-1"></i>修复中'; // 处理修复 setTimeout(() => { const result = fixQuotes(text); outputText.innerHTML = result.fixedText.replace(/\n/g, '<br>'); // 将原始文本同步到复制辅助区域 copyHelper.value = result.fixedText; // 更新统计信息 stats.classList.remove('hidden'); doubleQuotesFixed.textContent = result.doubleQuotesFixed; singleQuotesFixed.textContent = result.singleQuotesFixed; // 启用按钮 copyButton.disabled = false; swapButton.disabled = false; // 恢复按钮状态 fixButton.disabled = false; fixButton.innerHTML = '<i class="fa fa-magic mr-1"></i>修复'; showNotification(`修复完成: ${result.doubleQuotesFixed}组双引号, ${result.singleQuotesFixed}组单引号`); }, 200); }); // 清空输入 clearButton.addEventListener('click', () => { inputText.value = ''; outputText.innerHTML = '<div class="text-gray-400 text-center h-full flex items-center justify-center">修复后的文本将显示在这里</div>'; copyHelper.value = ''; stats.classList.add('hidden'); copyButton.disabled = true; swapButton.disabled = true; inputText.focus(); showNotification('已清空'); }); // 复制结果 - 修复版本 copyButton.addEventListener('click', async () => { try { // 尝试使用Clipboard API await navigator.clipboard.writeText(copyHelper.value); showNotification('已复制到剪贴板'); } catch (err) { try { // 备选方案：使用隐藏的textarea copyHelper.select(); copyHelper.setSelectionRange(0, 99999); document.execCommand('copy'); showNotification('已复制到剪贴板'); } catch (err2) { showNotification('复制失败，请手动复制', false); console.error('复制失败:', err2); } } }); // 交换输入输出 swapButton.addEventListener('click', () => { inputText.value = copyHelper.value; outputText.innerHTML = '<div class="text-gray-400 text-center h-full flex items-center justify-center">修复后的文本将显示在这里</div>'; copyHelper.value = ''; stats.classList.add('hidden'); copyButton.disabled = true; swapButton.disabled = true; inputText.focus(); showNotification('已交换内容'); }); // 粘贴功能 pasteButton.addEventListener('click', async () => { try { const text = await navigator.clipboard.readText(); inputText.value = text; inputText.focus(); showNotification('已粘贴'); } catch (err) { showNotification('粘贴失败，请手动粘贴', false); console.error('粘贴失败:', err); } }); // 页面加载完成后聚焦到输入框 window.addEventListener('load', () => { inputText.focus(); }); </script> </body> </html>