javascript - 绑定(bind) "Ctrl+Alt+L"以将一些预定义的字符串插入焦点文本区域？

Question

是否可以绑定(bind) Ctrl+Alt+L 将预定义的字符串插入到 focused textarea 到光标位置？例如，我在文本区域中输入一些文本，然后按 Ctrl+Alt+L 和 <a href="" title=""></a>插入到当前光标位置。

Answer 1

是的。使用 keydown 事件和在 Stack Overflow 上 float 的 caret-position-in-textarea 函数之一。对于按键检测，请注意我必须使用 keydown 事件而不是 keypress 事件(应该用于检测输入的字符)，因为IE 不会触发 Ctrl+Alt+L 的 keypress 事件，因此这可能会在不同映射的键盘上出错。对于光标位置，我从 this answer 复制而来我自己也用过类似的东西。请参阅这些答案以讨论 IE 中的问题:

Caret position in textarea, in characters from the start Is there an Internet Explorer approved substitute for selectionStart and selectionEnd?

另外，请注意，您可能希望在执行此操作后将光标定位在合理的位置，我的代码没有涵盖这一点。

function getCaret(el) {
    if ("selectionStart" in el) {
        return el.selectionStart;
    } else if (document.selection) {
        el.focus();

        var r = document.selection.createRange();
        if (r == null) {
            return 0;
        }

        var re = el.createTextRange(), rc = re.duplicate();
        re.moveToBookmark(r.getBookmark());
        rc.setEndPoint("EndToStart", re);

        return rc.text.length;
    }
    return 0;
}

var textArea = document.getElementById("yourTextarea");
textArea.onkeydown = function(evt) {
    evt = evt || window.event;
    if (evt.ctrlKey && evt.altKey && evt.keyCode == 76) {
        var cursorPos = getCaret(this);
        this.value = this.value.slice(0, cursorPos)
                   + '<a href="" title=""></a>'
                   + this.value.slice(cursorPos)
        return false; // Prevent any default browser behaviour
    }
};