웹 페이지에서 xml을 표시, 강조 표시 및 편집하는 데 코드 미러를 사용하고 있지만 삽입 위치에서 오프셋 된 커서 위치에 문제가 있습니다. 따라서 문자를 삭제하면 깜박이는 커서는 예상보다 먼저 삭제 된 문자입니다. 내 페이지 외부에서 잘 작동하기 때문에 현재 페이지와의 CSS 충돌을 가정하고 있지만 어디에서나 충돌을 찾을 수 없습니다. 누구든지 비슷한 문제가 있거나 무엇을해야하는지 알고 있습니까?Codemirror 커서 위치 오프셋
4
A
답변
3
추가 조사에 따르면 문제의 원인 인 필드 세트에 포함 된 모든 div에 패딩이 설정되어 있습니다.
0
경우에 따라 기울임 꼴 또는 굵게 포함 된 줄 (OS 및 브라우저에 따라 다름) 아래에서 커서의 최대 세로 위치가 줄의 90 %까지 잘못 표시 될 수 있습니다. 예를 들면 다음과 같이 설정하여 쉽게 수정할 수 있습니다.
.CodeMirror pre {
height:15px;
}
귀하의 CSS 스타일 시트에있는 모든 곳. 또한 서로 너무 가깝게 보이는 코드 행을 발견하면 행 높이를 제어 할 수있는 방법을 제공합니다.
3
다음 행은 나를 위해 문제를 해결 : 내 CodeMirror 구성에 lineWrapping: true
을 사용하고
.CodeMirror pre {
white-space: pre-wrap;
word-break: break-all;
word-wrap: break-word;
}
. 이 값을 false로 설정하면됩니다.
0
들여 쓰기를 사용할 때 어떤 이유로 공백이 올바르게 처리되지 않았습니다. 나를 위해 codemirror.js
에 다음과 트릭 measureLine
기능을 않았다 교체 :
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;
}
1
것은 CodeMirror와 CSS에서 줌을 사용하여주의해야합니다.
본문 확대/축소 기능을 사용했습니다.
관련 문제
- 1. CodeMirror 코드 완성 분석 커서 위치
- 2. 오프셋 값으로 커서 위치 이동
- 3. Visual Studio - 커서 오프셋?
- 4. 커서 위치
- 5. Google지도 v3의 기본 위치 오프셋 오프셋
- 6. MousePressEvent, QGraphicsView의 위치 오프셋
- 7. 앵커의 오프셋 위치 얻기
- 8. XNA 마우스 위치 오프셋
- 9. 오프셋 위치 계산
- 10. jQuery (캐리지가 아님)로 커서 오프셋
- 11. DateTimePicker의 커서/선택 위치
- 12. Vim의 점프/위치 커서
- 13. 커서 위치 찾기
- 14. 터미널 커서 위치 얻기
- 15. 텍스트 입력란의 커서 위치
- 16. 커서 위치 문제가 발생했습니다.
- 17. EditText의 커서 위치
- 18. TEXTAREA에서 커서 위치 찾기
- 19. uitextfield의 커서 위치
- 20. EditText 커서 위치
- 21. 커서 위치, jquery
- 22. UITextview에서 커서 위치 변경
- 23. CSS 커서 URL 위치
- 24. 요소의 오프셋 클라이언트 위치 찾기
- 25. PHP에서 오프셋 할 TimeZone 위치
- 26. jQuery에서 정수가 아닌 오프셋 위치
- 27. 커서 위치 변경없이 화면 이동
- 28. contenteditable div 커서 위치 얻기
- 29. 텍스트 상자에 커서 위치 이동
- 30. 자바 스크립트에서 마우스 커서 위치?