keydown事件仅在按下任何其他键后才起作用

时间:2014-08-02 13:30:17

标签: javascript firefox-addon mozilla

我正在开发一个Mozilla附加组件,它用左移+等效替换左侧的数字键。例如,如果按1,它将被'!'取代自动(特别是在线编译器)。这是代码

document.activeElement.addEventListener("keydown",keyc);
var ch = [')','!','@','#','$','%','^','&','*','('];
function keyc(event)
{
    var x = document.activeElement.value;
    if( event.keyCode >= 48 && event.keyCode <= 57)
        {
            event.preventDefault();

            x= x + ch[event.keyCode -48];
        }
    document.activeElement.value = x ;
}

这样可以正常工作,但只有在数字键后按下另一个键时才会替换该字符。 任何人都可以指出为什么会发生这种情况...... 提前谢谢。

1 个答案:

答案 0 :(得分:1)

这是因为你正在使用keydown事件。它在输入输入字段之前触发。如果你改为使用keyup事件,它将在输入实际输入到输入字段时触发。

更新:

好的,所以我通过以下更正更新了我的答案。我通过阻止keydown事件的默认行为来阻止输入。我将字符插入插入符号位置,而不是将其附加到textarea的末尾。

工作小提琴:http://jsfiddle.net/e4VaY/6/

document.activeElement.addEventListener("keydown",blockInput);
document.activeElement.addEventListener("keyup",keyc);

var ch = [')','!','@','#','$','%','^','&','*','('];
function keyc(event)
{
    var txtArea = document.activeElement;
    var x = txtArea.value;
    if( event.keyCode >= 48 && event.keyCode <= 57)
        {
            insertAtCaret(txtArea, ch[event.keyCode -48]);
        }
}

function blockInput(event){
    if( event.keyCode >= 48 && event.keyCode <= 57)
    {
        event.preventDefault();   
    }
}

function insertAtCaret(txtarea,text) {
    var scrollPos = txtarea.scrollTop;
    var strPos = 0;
    var br = ((txtarea.selectionStart || txtarea.selectionStart == '0') ? 
        "ff" : (document.selection ? "ie" : false ) );
    if (br == "ie") { 
        txtarea.focus();
        var range = document.selection.createRange();
        range.moveStart ('character', -txtarea.value.length);
        strPos = range.text.length;
    }
    else if (br == "ff") strPos = txtarea.selectionStart;

    var front = (txtarea.value).substring(0,strPos);  
    var back = (txtarea.value).substring(strPos,txtarea.value.length); 
    txtarea.value=front+text+back;
    strPos = strPos + text.length;
    if (br == "ie") { 
        txtarea.focus();
        var range = document.selection.createRange();
        range.moveStart ('character', -txtarea.value.length);
        range.moveStart ('character', strPos);
        range.moveEnd ('character', 0);
        range.select();
    }
    else if (br == "ff") {
        txtarea.selectionStart = strPos;
        txtarea.selectionEnd = strPos;
        txtarea.focus();
    }
    txtarea.scrollTop = scrollPos;
}