6

可以通过 javascript/jQuery触发选择开始吗?

在我看来,鼠标文本选择可以分为以下几个步骤:

1) 触发mousedown事件并开始选择

2)触发mousemove并移动选择的“终点”

3) 触发mouseup并停止选择

可以仅触发第 1 步),即在 span 元素中的文本上... ...所以在那之后,移动鼠标光标的行为就像选择等待 mouseup?

或者如何实现以及浏览器如何知道选择开始?

Rangy 库:我知道这个用于创建自定义范围选择的 javascript 库。但在我看来,通过鼠标事件模拟自己的选择太复杂了。我只想告诉浏览器,我在(span,offset 2)开始选择,它应该在步骤 2)继续。

4

1 回答 1

1

您可以使用可选择元素和文档上的鼠标事件来控制何时开始和结束选择以及何时要测试选择等。

然后在选择过程中,您可以使用它window.getSelection()来获取有关当前选择的信息。

尝试这样的事情:

var m_MouseDown = false;

document.getElementById('selectMyContent').onmousedown = function (e) {
    m_MouseDown = true;
};

document.onmouseup = function (e) {
    m_MouseDown = false;
};

document.onmousemove = function(e) {
    if (m_MouseDown) {
        document.getElementById('showTextHere').innerHTML = getSelectionInfo();
    }        
}

function getSelectionInfo() {
    var selected = "";
    if (typeof window.getSelection != "undefined") {
        var sel = window.getSelection();
        if (sel.rangeCount) {
            for (var i = 0, len = sel.rangeCount; i < len; ++i) {
                var range = sel.getRangeAt(i);

                var txt = document.createElement('div');
                txt.appendChild(range.cloneContents());
                selected = range.startContainer.parentNode.id + ':' + range.startOffset + '-' + range.endOffset + ' "' + txt.innerHTML + '"';
            }
        }
    }
    return selected;
}

有关示例,请参见http://jsfiddle.net/nY328/10/ 。

于 2012-11-06T14:26:05.400 回答