如何使用Rangy的toggleRange方法?

时间:2013-02-10 01:54:38

标签: javascript jquery rangy

我正在使用以下代码在范围内插入链接。

我有以下功能,可以通过按钮调用来保存所选文本。然后它显示linkBar div,其中包含用于链接插入的文本输入。

注意: 当我将焦点放在文本输入中的输入文本中时,我会丢失选择,所以我尝试使用toggleRange()而不是toggleSelection。

function linkIt(){
if (savedSel) {
rangy.removeMarkers(savedSel);
}
savedSel = rangy.saveSelection();
savedSelActiveElement = document.activeElement; 

$("#linkBar").css({"display":"block", "top": "150px", "left": "500px"});

}

之后,我有以下代码,在上一个函数显示的同一个div中单击一个按钮后执行。

    submitLink.ontouchstart = submitLink.onmousedown = function() {
        var linkName = $("#linkText").val();
        toggleLink(linkName);
        $("#linkBar").css({"display":"none"});
        if (savedSel) { 
            rangy.restoreSelection(savedSel, true);
            savedSel = null;
            gEBI("restoreButton").disabled = true;
            window.setTimeout(function() {
                if (savedSelActiveElement && typeof savedSelActiveElement.focus != "undefined") {
                    savedSelActiveElement.focus();
                }
            }, 1);
        } 

        return false;
    }

此函数调用以下函数将linkApplier应用于所选范围。但它 NOT 工作

function toggleLink(linkName) {
    linkApplier = rangy.createCssClassApplier("link", {
        elementTagName: "a",
        elementProperties: {
            href: linkName,
            title: "Rangy home page",
            target: "_self"
        }
    });
    //linkApplier.toggleSelection();
    linkApplier.toggleRange(savedSel);
}

1 个答案:

答案 0 :(得分:0)

您需要在恢复选择后调用toggleSelection()。我认为以下内容将解决它(未经测试):

submitLink.ontouchstart = submitLink.onmousedown = function() {
    var linkName = $("#linkText").val();
    $("#linkBar").css({"display":"none"});
    if (savedSel) { 
        rangy.restoreSelection(savedSel, true);
        toggleLink(linkName);
        savedSel = null;
        gEBI("restoreButton").disabled = true;
        window.setTimeout(function() {
            if (savedSelActiveElement && typeof savedSelActiveElement.focus != "undefined") {
                savedSelActiveElement.focus();
            }
        }, 1);
    } 

    return false;
};