小编mrw*_*wrk的帖子

JavaScript将鼠标位置转换为选择范围

我希望能够将当前鼠标位置转换为范围,特别是在CKEditor中.

CKEditor提供了一个API,用于根据范围设置光标:

var ranges = new CKEDITOR.dom.range( editor.document );
editor.getSelection().selectRanges( [ ranges ] );
Run Code Online (Sandbox Code Playgroud)

由于CKEditor提供了这个API,因此可以通过删除此要求来简化问题,并且只是找到一种方法来从包含各种HTML元素的div上的鼠标坐标生成范围.

但是,这与将鼠标坐标转换为textarea中的光标位置不同,因为textareas具有固定的列宽和行高,CKEditor通过iframe呈现HTML.

基于,看起来该范围可以应用于元素.

你如何计算出最接近当前鼠标位置的开始/结束范围?

编辑:如何使用ckeditor API在mouseup事件上选择范围的示例.

editor.document.on('mouseup', function(e) {
    this.focus();
    var node = e.data.$.target;

    var range = new CKEDITOR.dom.range( this.document );
    range.setStart(new CKEDITOR.dom.node(node), 0);
    range.collapse();

    var ranges = [];
    ranges.push(range);
    this.getSelection().selectRanges( ranges );
});
Run Code Online (Sandbox Code Playgroud)

上述示例的问题在于,事件目标节点(e.data.$.target)仅针对HTML,BODY或IMG等节点触发,但不针对文本节点触发.即使它这样做,这些节点也代表不支持将光标设置到该文本块内鼠标位置的文本块.

javascript range ckeditor

18
推荐指数
1
解决办法
3197
查看次数

JQuery在iframe之外可拖动.内部iframe可放置

我在iframe之外有一个可拖动的jquery.我需要在iframe droppables中创建元素.当我拖动iframe时,"over"事件不会触发,但如果我继续拖动iframe,则"over"事件会触发.

看起来这也发布在这里但从未回答过. jQuery和iframe以及奇怪的定位:是否有解决方法?

编辑:代码示例

HTML

<div id="draggable">
</div>

<iframe id="iframe"/>
Run Code Online (Sandbox Code Playgroud)

JavaScript的

$("#draggable").draggable();

var body = $('#iframe').contents().find('body');
$(body).droppable({
    over:function(event,ui) {
        alert('over droppable');
    }
});
Run Code Online (Sandbox Code Playgroud)

iframe jquery jquery-ui jquery-ui-draggable

5
推荐指数
1
解决办法
2677
查看次数