Определите, прокручивается ли CodeMirror донизу

Question

Я создаю редактор live-preview с CodeMirror. Мне нужно определить, прокручивается ли редактор CodeMirror до самого низа, чтобы я мог также прокручивать предварительный просмотр донизу.

Как я могу это определить?

Answer 1

Вам нужен элемент скроллера в codeMirror, а затем привяжите функцию к событию прокрутки.

jsfiddle

var editor = CodeMirror.fromTextArea(document.getElementById("code"), { 
    mode: "text/html" 
});  

var scrollElement = editor.getScrollerElement(); 
    console.log(scrollElement) 
    $(scrollElement).bind('scroll', function(e) { 
     var elem = $(e.currentTarget); 
     if (elem[0].scrollHeight - elem.scrollTop() == elem.outerHeight()) { 
      console.log("bottom"); 
     }  
    }); 

Answer 2

Если бы внести некоторые незначительные коррективы в решение aljordan82 в:

var editor = CodeMirror.fromTextArea(document.getElementById('post'), { 
    'mode': 'gfm', 
    'lineNumbers': true, 
    'theme': 'default', 
    'lineWrapping': true, 
}); 

var $preview = $('#preview-div'); 
var $scroller = $(editor.getScrollerElement()); 

$.fn.scrollHeight = function() { 
    return this[0].scrollHeight; 
}; 

var atBottom = $scroller.scrollHeight() - $scroller.scrollTop() - $scroller.outerHeight() <= 0 
    && $preview.scrollHeight() - $preview.scrollTop() - $preview.outerHeight() <= 0; 
$preview.html(html); 
if (atBottom) { 
    $preview.scrollTop($preview.scrollHeight()); 
} 

Число не выходило совершенно равны по моему предпросмотру DIV, так что я сделал <= 0 вместо этого. (2px off, возможно, из-за границ?)