css - コードミラーカーソル位置オフセット

Question

コードミラーを使用してWebページでxmlを表示、強調表示、編集していますが、カーソル位置が挿入位置からオフセットされているため、点滅しているカーソルがある場所から文字を削除すると、前の文字が表示されます。代わりに、期待するものが削除されます。それは私のページの外でうまく機能するので、私はそれが私の現在のページとのcssの衝突を想定していますが、どこでも衝突を見つけることができません。誰かが同様の問題を抱えているか、何をすべきか知っていますか？

score 3 · Accepted Answer

さらに調査したところ、問題の原因となったフィールドセットに埋め込まれたすべてのdivにページにパディングが設定されていたことがわかりました。

score 3 · Accepted Answer

次の行で問題が修正されました。

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

lineWrapping: trueCodeMirror構成で使用しています。これをfalseに設定することも同様に機能します。

score 3 · Accepted Answer

CodeMirrorでCSSを拡大する場合は注意が必要です。

私はボディのズームインを使用し、それを削除することでうまくいきました。

score 1 · Accepted Answer

この問題は、親コンテナのサイズを変更した後によく発生しました。助けになったのは：

editor.setSize("100%", "100%");
editor.focus();

サイズ変更イベントハンドラーの最後。

score 0 · Accepted Answer

また、斜体または太字を含む行の下（OSとブラウザによって異なります）で、カーソルの垂直位置が行の90％まで間違っている場合があります。設定することで簡単に修正できます。

.CodeMirror pre {
    height:15px;
}

CSSスタイルシートのどこにでも。これにより、コードの行が互いに近すぎる場合に、行の高さを制御する方法も提供されます。

score 0 · Accepted Answer

何らかの理由で、インデントが有効になっているときの空白は、線のサイズを計算するときに正しく処理されませんでした。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;
}

css - コードミラーカーソル位置オフセット

6 に答える 6

Related

Reference