Quill.js сбрасывает текст на нормальное при вводе вместо того, чтобы сохранить выбранную размер ⇐ Javascript

[Anonymous]

Я использую quill.js < /strong> и должен: < /p>

• Сделать «маленький» размер текста по умолчанию, когда редактор нагрузки. «Вместо того, чтобы сохранить выбранную размер).

Проблема:

• Редактор начинается с "Small" . < /li>
  Если пользователь выбирает другой размер, он работает при печати . < /li>
  Когда Пользователь нажимает Enter, новая линия всегда переключается на «нормальный» вместо того, чтобы сохранить выбранную размер. . "

code:
html:


Content Arabic
*

< /code>
javascript: < /p>

$(document)
.ready(
function() {
var contentInput = document.getElementById('contentAr');

// Initialize Quill editor
var quillAr = new Quill('#editor-container-ar', {
theme : 'snow',
modules : {
toolbar : [
[ {
'font' : []
} ],
[ {
'size' : [ 'small', 'normal', 'large',
'huge' ]
} ],
[ 'bold', 'italic', 'underline',
'strike' ], [ {
'color' : []
}, {
'background' : []
} ], [ {
'script' : 'sub'
}, {
'script' : 'super'
} ], [ {
'header' : 1
}, {
'header' : 2
} ], [ 'blockquote', 'code-block' ],
[ {
'list' : 'ordered'
}, {
'list' : 'bullet'
} ], [ {
'indent' : '-1'
}, {
'indent' : '+1'
} ], [ {
'direction' : 'rtl'
} ], [ {
'align' : []
} ], [ 'link', 'image', 'video' ],
[ 'clean' ] ]
}
});

console.log(quillAr);

let userSelectedSize = 'small'; // Track the user’s selected size

// Force "Small" as the default size on load
setTimeout(function () {
let editorContent = quillAr.root.innerHTML.trim();
console.log('Editor content:', editorContent);
if (editorContent === "
") {
quillAr.root.innerHTML = '


'; // Ensure small visually
}
quillAr.format('size', 'small'); // Make sure new text starts as "small"
}, 100);

// Detect when the user selects a size
quillAr.on('selection-change', function (range) {
console.log('Selection changed:', range);
if (range) {
let format = quillAr.getFormat(range);
console.log('Format:', format);
userSelectedSize = format.size !== undefined ? format.size : 'normal'; // Store user-selected size
}
});

// Ensure newly typed text follows the selected size
quillAr.on('text-change', function (delta, oldDelta, source) {
console.log('Text changed:', delta, 'Source:', source);
if (source === 'user') {
let format = quillAr.getFormat();
console.log('Current format:', format, 'User selected size:', userSelectedSize);
if (!format.size || format.size !== userSelectedSize) {
quillAr.format('size', userSelectedSize); // Apply user-selected size
}
}
});

// Keep the selected size when pressing Enter
quillAr.keyboard.addBinding({ key: 'Enter' }, function (range) {
setTimeout(() => {
let newSize = userSelectedSize || 'small'; // Ensure we have a size

// Move cursor to the new line and apply formatting
quillAr.formatText(range.index, 1, 'size', newSize);

console.log('New line formatted to:', newSize);
}, 0);
});

// Force "Small" to always use
quillAr.clipboard.addMatcher(Node.ELEMENT_NODE, function (node, delta) {
console.log('Pasted content:', node, delta);
delta.ops.forEach(op => {
if (op.attributes && !op.attributes.size) {
console.log('Applying small size to:', op);
op.attributes.size = 'small'; // Ensure "small" gets a
}
});
return delta;
});
....

< /code>
Проблема: < /strong> < /p>

Даже с помощью этого кода нажатие ввода сбрасывает текст к " Нормальный «вместо того, чтобы сохранить выбранный размер.>

Подробнее здесь: https://stackoverflow.com/questions/794 ... ected-size