6

javascript/jQueryを介して選択開始をトリガーすることは可能ですか?

私の意見では、マウスによるテキスト選択は次のステップに分けられます。

1) mousedownイベントをトリガーし、選択を開始します

2) mousemoveをトリガーし、選択範囲の「終点」を移動する

3) マウスアップのトリガーと選択の停止

ステップ 1)だけをトリガーすることは可能です。つまり、span 要素内のテキストで... ...その後、マウス カーソルを移動すると、マウスアップを待っている選択のように動作しますか?

または、どのように実装され、ブラウザが選択の開始をどのように認識するのでしょうか?

Rangey ライブラリ:カスタム範囲選択を作成するためのこの 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 に答える