3

我正在构建一个终端仿真并遇到在 Firefox 中捕获退格的问题。我可以在提示符下获取第一个退格并删除输入中的最后一个字符，但它不会持续存在并删除多个字符。

实际网址：http ://term.qt.io/

此处复制：http: //jsfiddle.net/BgtsE/1/

JavaScript 代码

function handleKeys(e){
    var evt = e || window.event;
    var key = evt.charCode || evt.keyCode;
    if(evt.type == "keydown")
    {
        curr_key = key;
        if(key == 8)
        {
            evt.preventDefault();
            if(0 < $('body').text().length)
                $('body').text($('body').text().slice(0,-1));
        }
    }
    else if(evt.type == "keypress")
    {
        if(97 <= key && key <= 122)
        {
            if(curr_key != key)
                $('body').append(String.fromCharCode(key));
        }
        else
            $('body').append(String.fromCharCode(key));
    }
}
$(function(){
    $('html').live({
        keydown:function(e){
            handleKeys(e);
        },
        keypress:function(e){
            handleKeys(e);
        }
    })
})​
4

4 回答 4

5

试试这个：http: //jsfiddle.net/NBZG8/1/

您需要在 keydown 和 keypress 中处理退格键以支持 Chrome 和 Firefox

function handleKeys(e){
    var evt = e || window.event;
    var key = evt.charCode || evt.keyCode;

    if (evt.type == "keydown") {
        curr_key = key;
        if(key == 8 && !$.browser.mozilla) {
            backspaceHandler(evt);
        }
    } else if (evt.type == "keypress") {
        if (key == 8) {
            backspaceHandler(evt);
        } else if (97 <= key && key <= 122) {
            if(curr_key != key) {
                $('body').append(String.fromCharCode(key));
            }
        } else {
            $('body').append(String.fromCharCode(key));
        }
    }
}

function backspaceHandler(evt) {
    evt.preventDefault();
    if(0 < $('body').text().length) {
        $('body').text($('body').text().slice(0,-1));
    }  
};

$(function(){
    $('html').live({
        keydown : handleKeys,
        keypress : handleKeys
    })
})​
于 2012-12-27T06:52:21.823 回答
0

在 Firefox Windows 17.0.1 中，任何由 $("selector").text() 返回的值都会在末尾添加一个新行字符。所以子字符串对我不起作用：

<html>
    <head>
        <title>test</title>
        <script src="jquery.js"></script>
        <script>
            $("document").ready(function(){
                console.log("body text seems to have a new line character");
                console.log(($('body').text()[5]=="\n"));
            });

            function handleKeys(e){
                var evt = e || window.event;
                var key = evt.charCode || evt.keyCode;
                if(evt.type == "keydown")
                {
                    curr_key = key;
                    if(key == 8)
                    {
                        evt.preventDefault();
                        if(0 < $('body').text().length)
                            // next line works, you might trim the \n if it's there at the end
                            //$('body').text($('body').text().slice(0,-2));
                            // this one didn't work for me
                             $('body').text($('body').text().substring(0,$('body').text().length-1)); 
                    }
                }
                else if(evt.type == "keypress")
                {
                    if(97 <= key && key <= 122)
                    {
                        if(curr_key != key)
                            $('body').append(String.fromCharCode(key));
                    }
                    else
                        $('body').append(String.fromCharCode(key));
                }
            }
            $(function(){
                $('html').live({
                    keydown:function(e){
                        handleKeys(e);
                    },
                    keypress:function(e){
                        handleKeys(e);
                    }
                })
            })
        </script>
    </head>
    <body>12345</body>
</html>
于 2012-12-27T06:55:11.447 回答
0 
$('#id').keypress(function(e) {

if(e.charCode > 0 || e.keyCode === 8){
 if(e.keyCode === 8){
   return true;
 }else if((e.charCode !== 0) && ((e.charCode  > 57 && e.charCode  < 65)){
   return false;
   }
 }else if((e.keyCode !== 0) && ((e.keyCode  > 57 && e.keyCode  < 65)){
  return false;
 }
});
于 2015-02-05T20:15:40.837 回答
0

我在 Mozilla 上的按键也有同样的问题。多亏了这个主题，它解决了我的问题，所以如果有人尝试和我做同样的事情，我会发布我的代码。
在我的示例中，当用户键入两个数字时，我尝试使用自动空格，但它在 Firefox 中不起作用，所以这是我的代码：

$(function() {

    $('#field1, #field2').on('keypress',function(event) {
        event = event || window.event;
        var charCode = event.keyCode || event.which,
            lgstring = $(this).val().length,
            trimstring;
        if(charCode === 8) {
            event.returnValue = false;
            if(event.preventDefault)
                event.preventDefault();
            if(0 < $(this).val().length) {
                $(this).val($(this).val().slice(0,-1));
            }  
        }
        else if(((charCode > 31) && (charCode < 48 || charCode > 57)) || lgstring >= 14) {
            event.returnValue = false;
            if(event.preventDefault)
                event.preventDefault();
        }
        else {
            trimstring = $(this).val().replace(/ /g,"");
            if((lgstring !== 0) && (trimstring.length % 2) === 0 ) {
                $(this).val($(this).val() + ' ');
            }
        }
    });

});

我注意到 Mozilla 将退格键处理为 Chrome 没有的按键。

对不起我的英语我是法国人

于 2014-03-18T08:01:09.357 回答