Смещение позиции курсора Codemirror

Question

Я использую кодовое зеркало для отображения, выделения и редактирования xml на веб-странице, но у меня возникла проблема со смещением позиции курсора относительно позиции вставки, так что если вы удаляете символ, с которого мигает курсор,персонаж перед тем, которого вы ожидаете, будет удален.Я предполагаю, что это конфликт css с моей текущей страницей, потому что он хорошо работает за пределами моей страницы, но не могу найти столкновение в любом месте.Кто-нибудь имел подобные проблемы или знает, что делать?

Answer 1

Следующие строки устранили проблему для меня:

.CodeMirror pre {
    white-space: pre-wrap;
    word-break: break-all;
    word-wrap: break-word;
}

Я использую lineWrapping: true в моей конфигурации CodeMirror.Установка в false также работает.

Answer 2

Дальнейшие исследования показывают, что на странице были установлены отступы для всех элементов div, встроенных в наборы полей, что и стало причиной проблемы.

Answer 3

Будьте осторожны, используя zoom в вашем CSS с CodeMirror.

Я использовал zoom in body и удаление, которое мне помогло.

Answer 4

По какой-то причине пробелы при включении отступа не были правильно обработаны при расчете размера строки.Замена функции measureLine на следующую в codemirror.js сделала свое дело:

function measureLine(cm, line) {
    // First look in the cache
    var cached = findCachedMeasurement(cm, line);
    if (cached) return cached.measure;

    // Failing that, recompute and store result in cache
    var measure = measureLineInner(cm, line);

    var origL;
    var origR;
    var lastR ="";
    for (var mes in measure) {
        origL = measure[mes].left;
        origR = measure[mes].right;

        if (lastR != "") {
            measure[mes].left = lastR;
            measure[mes].right = lastR + (origR - origL);
        }

        if (origL == origR) {
            measure[mes].right = measure[mes].right + 8;
        }
        lastR = measure[mes].right;
    }

    var cache = cm.display.measureLineCache;
    var memo = {
        text: line.text, 
        width: cm.display.scroller.clientWidth,
        markedSpans: line.markedSpans,
        measure: measure,
        classes: line.textClass + "|" + line.bgClass + "|" + line.wrapClass
    };

    if (cache.length == 16) cache[++cm.display.measureLineCachePos % 16] = memo;
    else cache.push(memo);
    return measure;
}

Answer 5

Иногда, кроме того, под курсивом или полужирным шрифтом (в зависимости от вашей ОС и браузера) курсор имеет неправильную вертикальную позицию до 90% строки. Это можно легко исправить, установив, например,

.CodeMirror pre {
    height:15px;
}

где угодно в ваших таблицах стилей CSS. Это также дает вам возможность контролировать высоту строк, если строки кода отображаются слишком близко друг к другу.