名片制作

在线名片制作，多种风格模板，支持自定义颜色和打印

信息
预览
张三
产品经理
科技有限公司
+86 138 0000 0000
zhangsan@example.com
www.example.com
北京市朝阳区
" + '
' + cardHtml + cardHtml + cardHtml + cardHtml + "
" + ""; const printWindow = window.open("", "_blank"); if (printWindow) { printWindow.document.open(); printWindow.document.write(printContent); printWindow.document.close(); printWindow.onload = function () { printWindow.print(); }; } showStatus("打印窗口已打开", "success"); } Object.values(inputs).forEach(function (input) { input.addEventListener("input", updatePreview); }); document.querySelectorAll(".style-btn").forEach(function (btn) { btn.addEventListener("click", function () { document.querySelectorAll(".style-btn").forEach(function (b) { b.classList.remove("active"); }); btn.classList.add("active"); currentStyle = btn.dataset.style; updatePreview(); }); }); document.getElementById("btnPrint").onclick = printCards; document.getElementById("btnShare").onclick = async function () { saveToUrl(); try { await navigator.clipboard.writeText(location.href); showStatus("链接已复制", "success"); } catch (e) { showStatus("复制失败", "error"); } }; document.getElementById("btnClear").onclick = function () { Object.values(inputs).forEach(function (input) { if (input.type === "color") { if (input.id === "inputBgColor") input.value = "#1a1a2e"; else if (input.id === "inputTextColor") input.value = "#ffffff"; else if (input.id === "inputAccentColor") input.value = "#00d4aa"; } else { input.value = ""; } }); currentStyle = "modern"; document.querySelectorAll(".style-btn").forEach(function (btn) { btn.classList.toggle("active", btn.dataset.style === "modern"); }); localStorage.removeItem(LS_KEY); history.replaceState(null, "", location.pathname); updatePreview(); showStatus("已清空", "success"); }; window.toggleTheme = function () { const html = document.documentElement; const currentTheme = html.getAttribute("data-theme") || "dark"; const newTheme = currentTheme === "light" ? "dark" : "light"; html.setAttribute("data-theme", newTheme); localStorage.setItem("theme", newTheme); }; function initTheme() { const savedTheme = localStorage.getItem("theme"); const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches; const theme = savedTheme || (prefersDark ? "dark" : "light"); document.documentElement.setAttribute("data-theme", theme); } window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", function (e) { if (!localStorage.getItem("theme")) document.documentElement.setAttribute("data-theme", e.matches ? "dark" : "light"); }); initTheme(); if (!loadFromUrl()) loadFromStorage(); updatePreview();