WeWork/invitation-maker
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(toolbar): 支持在选中元素上应用样式

Browse Source
This commit is contained in:
ZF Sun
2026-04-21 09:52:01 +08:00
parent b881f31920
commit 91463b31a3
1 changed files with 14 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
js/script.js
View File

@@ -1680,16 +1680,17 @@
function initTextEditorToolbar() { function initTextEditorToolbar() {
// 加粗按钮 // 加粗按钮
boldBtn.addEventListener('click', () => { boldBtn.addEventListener('click', () => {
if (!editingInput) return; const targetInput = editingInput || selectedInput;
if (!targetInput) return;
const selection = window.getSelection(); const selection = window.getSelection();
if (selection.rangeCount > 0 && !selection.isCollapsed) { if (selection.rangeCount > 0 && !selection.isCollapsed) {
document.execCommand('bold', false, null); document.execCommand('bold', false, null);
} else { } else {
const isBold = boldBtn.classList.contains('active'); const isBold = boldBtn.classList.contains('active');
if (isBold) { if (isBold) {
editingInput.style.fontWeight = 'normal'; targetInput.style.fontWeight = 'normal';
} else { } else {
editingInput.style.fontWeight = 'bold'; targetInput.style.fontWeight = 'bold';
} }
boldBtn.classList.toggle('active'); boldBtn.classList.toggle('active');
} }
@@ -1697,16 +1698,17 @@
// 斜体按钮 // 斜体按钮
italicBtn.addEventListener('click', () => { italicBtn.addEventListener('click', () => {
if (!editingInput) return; const targetInput = editingInput || selectedInput;
if (!targetInput) return;
const selection = window.getSelection(); const selection = window.getSelection();
if (selection.rangeCount > 0 && !selection.isCollapsed) { if (selection.rangeCount > 0 && !selection.isCollapsed) {
document.execCommand('italic', false, null); document.execCommand('italic', false, null);
} else { } else {
const isItalic = italicBtn.classList.contains('active'); const isItalic = italicBtn.classList.contains('active');
if (isItalic) { if (isItalic) {
editingInput.style.fontStyle = 'normal'; targetInput.style.fontStyle = 'normal';
} else { } else {
editingInput.style.fontStyle = 'italic'; targetInput.style.fontStyle = 'italic';
} }
italicBtn.classList.toggle('active'); italicBtn.classList.toggle('active');
} }
@@ -1714,19 +1716,21 @@
// 颜色选择器 // 颜色选择器
colorPicker.addEventListener('input', () => { colorPicker.addEventListener('input', () => {
if (!editingInput) return; const targetInput = editingInput || selectedInput;
if (!targetInput) return;
const selection = window.getSelection(); const selection = window.getSelection();
if (selection.rangeCount > 0 && !selection.isCollapsed) { if (selection.rangeCount > 0 && !selection.isCollapsed) {
document.execCommand('foreColor', false, colorPicker.value); document.execCommand('foreColor', false, colorPicker.value);
} else { } else {
editingInput.style.color = colorPicker.value; targetInput.style.color = colorPicker.value;
} }
}); });
// 字体选择器 // 字体选择器
fontPicker.addEventListener('change', () => { fontPicker.addEventListener('change', () => {
if (!editingInput) return; const targetInput = editingInput || selectedInput;
editingInput.style.fontFamily = fontPicker.value + ', sans-serif'; if (!targetInput) return;
targetInput.style.fontFamily = fontPicker.value + ', sans-serif';
}); });
// 字号选择器 - 密码锁式滚轮 // 字号选择器 - 密码锁式滚轮