如何获得当前的阻止位置?

时间:2011-12-01 21:06:29

标签: javascript tinymce

我们假设我有这样的处理程序:

ed.onNodeChange.add(function(ed, cm, e) {
});

如何获取已触发事件的当前对象e的位置(左上角坐标)?

我需要这个能够在当前块的正上方/上方绘制我自己的浮动弹出窗口(div)。

1 个答案:

答案 0 :(得分:2)

试试这个:

相对于编辑窗口:

ed.onNodeChange.add(function(ed, cm, e) {
    console.log( tinymce.DOM.getPos(e) );

    /* Ex:
     *   Object
     *   x: 8
     *   y: 30
     */
});

相对于持有编辑器的主体:

// From http://stackoverflow.com/questions/442404/dynamically-retrieve-html-element-x-y-position-with-javascript
function getOffset( el ) {
    var _x = 0;
    var _y = 0;
    while( el && !isNaN( el.offsetLeft ) && !isNaN( el.offsetTop ) ) {
        _x += el.offsetLeft - el.scrollLeft;
        _y += el.offsetTop - el.scrollTop;
        el = el.offsetParent;
    }
    return { y: _y, x: _x };
}

tinyMCE.init({
    // ...
    setup: function(ed) {
        ed.onNodeChange.add(function(ed, cm, e) {
            var coords = tinymce.DOM.getPos(e),
                ed_coords = getOffset( ed.getContentAreaContainer() ),
                x, y;

            x = coords.x + ed_coords.x;
            y = coords.y + ed_coords.y;
        });
    }
});