我可以有条件地更改输入到按键上的字符吗?

以下内容将完成此项工作。它是基于 an answer I wrote to another question . 自定义 transformTypedChar 函数以满足您的需要;我的示例只将字母a-g大写。

如果您需要在文本区域而不是 <input type="text"> 然后请注意,IE<=8中存在换行符问题,为了简洁起见,以下代码无法处理这些问题。您可以在下面的文本区域中找到用于获取所选内容的跨浏览器功能: Is there an Internet Explorer approved substitute for selectionStart and selectionEnd?

function transformTypedChar(charStr) {
    return /[a-g]/.test(charStr) ? charStr.toUpperCase() : charStr;
}

document.getElementById("your_input_id").onkeypress = function(evt) {
    var val = this.value;
    evt = evt || window.event;

    // Ensure we only handle printable keys, excluding enter and space
    var charCode = typeof evt.which == "number" ? evt.which : evt.keyCode;
    if (charCode && charCode > 32) {
        var keyChar = String.fromCharCode(charCode);

        // Transform typed character
        var mappedChar = transformTypedChar(keyChar);

        var start, end;
        if (typeof this.selectionStart == "number" && typeof this.selectionEnd == "number") {
            // Non-IE browsers and IE 9
            start = this.selectionStart;
            end = this.selectionEnd;
            this.value = val.slice(0, start) + mappedChar + val.slice(end);

            // Move the caret
            this.selectionStart = this.selectionEnd = start + 1;
        } else if (document.selection && document.selection.createRange) {
            // For IE up to version 8
            var selectionRange = document.selection.createRange();
            var textInputRange = this.createTextRange();
            var precedingRange = this.createTextRange();
            var bookmark = selectionRange.getBookmark();
            textInputRange.moveToBookmark(bookmark);
            precedingRange.setEndPoint("EndToStart", textInputRange);
            start = precedingRange.text.length;
            end = start + selectionRange.text.length;

            this.value = val.slice(0, start) + mappedChar + val.slice(end);
            start++;

            // Move the caret
            textInputRange = this.createTextRange();
            textInputRange.collapse(true);
            textInputRange.move("character", start - (this.value.slice(0, start).split("\r\n").length - 1));
            textInputRange.select();
        }

        return false;
    }
};

如何防止默认操作,然后触发按键?有点像

function onKeypressHandler(e)
{
    if ( condition )
    {
        e.preventDefault();
        // create new event object (you may clone current e)
        var ne = new jQuery.Event("keypress");
        ne.which = e.which - 32;
        $(e.target).trigger(ne);   // you may have to invoke with setTimeout
    }
}

你得看看这个……工作之后我对自己很满意。

很明显,您希望包含足够的条件,以避免进入循环。

当条件的计算结果为true时,下面的代码将返回false,但它使用不会返回false的不同charcode触发同一事件。

document.getElementById("input1").onkeypress = Handler;
function Handler(e)
{
    e = e || window.event;
    if ( e.charCode == 97 )
    {
        var evt = document.createEvent("KeyboardEvent");
        evt.initKeyEvent("keypress",true, true, window, false, false,false, false, 0, e.charCode -32);
        this.dispatchEvent(evt);
        return false;
    }
    return true;
}

你可以在IE中使用FireEvent… 我用过 http://help.dottoro.com/ljrinokx.php 和 https://developer.mozilla.org/en/DOM/event.initKeyEvent 供参考

不太确定你想要什么,但这行吗?

$('#my_element').keyup(function(){ $(this).val().toUpperCase(); });

或者使用子字符串获取最后一个字符并执行 toUpperCase() 在那上面?

(PSST…您也可以使用按键或按键)。

你能用CSS吗?

<input type="text" style="text-transform: uppercase;" />

彼得,

你可以在这里找到一些灵感:

http://www.maconstateit.net/tutorials/JSDHTML/JSDHTML15/jsdhtml15-05.htm

基本上是通过各种方式来查看“区域”周围的按键事件和功能。