簡體轉繁體(純 HTML + 純 JS) ~ 線上簡體轉繁體工具(online-tw_cn)
簡體轉繁體(純 HTML + 純 JS) ~ 線上簡體轉繁體工具(online-tw_cn)
資料來源(chatgpt): https://chatgpt.com/s/t_68e768ef13488191bf858694ff3ebf07
GITHUB: https://github.com/jash-git/online-tw_cn
實際實作可線上使用: http://jashliao.eu/tools/tw_cn/
HTML code:
<!doctype html> <html lang="zh-Hant"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width,initial-scale=1" /> <title>簡體轉繁體(純 HTML + 純 JS)</title> <style> body { font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans TC", "Microsoft JhengHei", "PingFang TC"; padding: 20px; background:#f7f9fc; color:#111; } h1 { font-size: 20px; margin-bottom: 6px; } .box { display:flex; gap:12px; } textarea { width:100%; height:220px; padding:10px; border:1px solid #ddd; border-radius:6px; resize:vertical; background:#fff; } .col { flex:1; display:flex; flex-direction:column; } .controls { margin-top:10px; display:flex; gap:8px; } button { padding:8px 12px; border-radius:6px; border:1px solid #cfd8e3; background:#fff; cursor:pointer; } button.primary { background:#246f9e; color:#fff; border-color:#1f5e84; } .small { font-size:12px; color:#666; margin-top:8px; } </style> </head> <body> <h1>簡體↔繁體(純 HTML + 純 JS)</h1> <div class="box"> <div class="col"> <label>輸入(簡體)</label> <textarea id="inputText" placeholder="在這裡貼上簡體中文或混合文字...">(示例:简体中文转换为繁体中文,软件、模块,医院,医生,里程碑)</textarea> <div class="controls"> <button id="convertBtn" class="primary">轉換 →</button> <button id="swapBtn">交換</button> <button id="copyOutBtn">複製結果</button> </div> </div> <div class="col"> <label>輸出(繁體)</label> <textarea id="outputText" readonly placeholder="轉換結果會顯示在這裡..."></textarea> <div class="controls"> <button id="toInputBtn">貼回左側</button> <button id="clearBtn">清除</button> </div> </div> </div> <br/> <div class="box,small">說明:此檔案使用內建詞表與字表做轉換;要更精準可加入更多詞條或用專業字典(如 OpenCC)。</div> <script src="tw_cn.js"></script> <script> // 保證 tw_cn_convert 已定義 const input = document.getElementById('inputText'); const output = document.getElementById('outputText'); const convertBtn = document.getElementById('convertBtn'); const copyOutBtn = document.getElementById('copyOutBtn'); const swapBtn = document.getElementById('swapBtn'); const toInputBtn = document.getElementById('toInputBtn'); const clearBtn = document.getElementById('clearBtn'); convertBtn.addEventListener('click', () => { const src = input.value || ''; try { const converted = window.tw_cn_convert(src); output.value = converted; } catch (e) { output.value = '轉換錯誤:' + e.message; } }); copyOutBtn.addEventListener('click', async () => { if (!output.value) return alert('沒有可複製的結果。'); try { await navigator.clipboard.writeText(output.value); alert('已複製到剪貼簿'); } catch { alert('複製失敗,請手動選取並複製。'); } }); swapBtn.addEventListener('click', () => { const a = input.value; input.value = output.value; output.value = a; }); toInputBtn.addEventListener('click', () => { input.value = output.value; }); clearBtn.addEventListener('click', () => { input.value = ''; output.value = ''; }); // 預設自動轉換一次(示範) convertBtn.click(); </script> </body> </html>
js code: 因為不聽AI的話把上千筆字典都放進去 所以太大 請去GITHUB查看