www.webdeveloper.com
Results 1 to 10 of 10

Thread: Capture Backspace problems

Hybrid View

  1. #1
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    2,360

    Capture Backspace problems

    I haven't tried any other browser yet but in chrome, capturing the backspace key is not working out too well.

    I have used the following to capture the keys,


    Code:
    window.onkeypress = function(){
    try{
    	var k= event.which || event.charCode || event.keyCode;	
    	var key = String.fromCharCode(k);
    ...
    the alternate code I have used is that seems to capture the keys but still the problem exists is
    Code:
    window.onkeydown = function(){
    try{
    	var k= event.which || event.charCode || event.keyCode;	
    	var key = String.fromCharCode(k);
    ...
    While using in a text area the back space and cursor keys are not a problem but capturing keys like back space is a problem when the textarea does not have focus.

    I have tried to surpress the window redirection from the back space being hit when the textarea has no focus.. just not happening.

    Any ideas?
    Yes, I know I'm about as subtle as being hit by a bus..(\\.\ Aug08)
    Yep... I say it like I see it, even if it is like a baseball bat in the nutz... (\\.\ Aug08)
    I want to leave this world the same way I came into it, Screaming, Incontinent & No memory!
    I laughed that hard I burst my colostomy bag... (\\.\ May03)
    Life for some is like a car accident... Mine is like a motorway pile up...

    Problems with Vista? :: Getting Cryptic wid it. :: The 'C' word! :: Whois?

  2. #2
    Join Date
    Jun 2008
    Posts
    106
    How do you expect to get event.which if event is undefined? You didn't define it as a parameter.


    This is what I would do....
    Code:
    window.addEventListener('keypress', function (event) {
        var key_code, key;
    
        event = event || window.event; // IE
        key_code = event.charCode || event.keyCode || event.which || 0;
        key = String.fromCharCode(key_code);
    
        if (key_code === 8) { // 8 = backspace, 46 = delete
            event.preventDefault();
        }
    
        // rest of code
    }, false);

  3. #3
    Join Date
    Mar 2009
    Posts
    501
    Just as a matter of curiosity, why do you need to capture the backspace key?

    You could, perhaps, do it indirectly by recording the value of an input element after every keyup event and then comparing it to the previous value. For example, if the value of input element A is "hello" (length = 5) and after a key is pressed it is "hell" (length = 4) you can pretty well figure that the backspace or delete key was pressed. (and does it matter to you whether it was backspace or delete?)

    --PS Have you looked over at quirksmode.org? PPK has a very detailed document about the nightmarish problems in creating cross-browser capture of non-printable characters such as 'backspace.'
    Last edited by Tcobb; 08-06-2013 at 01:21 PM. Reason: forgot something

  4. #4
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    2,360
    Quote Originally Posted by Tcobb View Post
    Just as a matter of curiosity, why do you need to capture the backspace key?

    You could, perhaps, do it indirectly by recording the value of an input element after every keyup event and then comparing it to the previous value. For example, if the value of input element A is "hello" (length = 5) and after a key is pressed it is "hell" (length = 4) you can pretty well figure that the backspace or delete key was pressed. (and does it matter to you whether it was backspace or delete?)

    --PS Have you looked over at quirksmode.org? PPK has a very detailed document about the nightmarish problems in creating cross-browser capture of non-printable characters such as 'backspace.'
    Because backspace takes the web page backwards to the previous or the opening / holding page and I am making a tool that I will be using on my local PC and I don't want the page I am on being moved away from.
    Yes, I know I'm about as subtle as being hit by a bus..(\\.\ Aug08)
    Yep... I say it like I see it, even if it is like a baseball bat in the nutz... (\\.\ Aug08)
    I want to leave this world the same way I came into it, Screaming, Incontinent & No memory!
    I laughed that hard I burst my colostomy bag... (\\.\ May03)
    Life for some is like a car accident... Mine is like a motorway pile up...

    Problems with Vista? :: Getting Cryptic wid it. :: The 'C' word! :: Whois?

  5. #5
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    2,360
    I was following well established examples, thats how!

    Tried it and other examples and none of them, not even in FireFox prevents the default backspace action.

    I then tried some examples like :
    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <title>preventDefault example</title>
    
    <script>
    var myTextbox = document.getElementById('my-textbox');
    
    function checkName(evt) {
        var charCode = evt.charCode;
    
        if (charCode != 0) {
            if (charCode < 97 || charCode > 122) {
                evt.preventDefault();
                alert(
                    "Please use lowercase letters only." + "\n"
                    + "charCode: " + charCode + "\n"
                );
            }
        }
    }
    
    myTextbox.addEventListener( 'keypress', checkName, false );
    
    </script>
    </head>
    
    <body>
    
    <p>Please enter your name using lowercase letters only.</p>
    <form>
    <input type="text" id="my-textbox" />
    </form>
    
    </body>
    </html>
    But not even this worked as it states.
    Yes, I know I'm about as subtle as being hit by a bus..(\\.\ Aug08)
    Yep... I say it like I see it, even if it is like a baseball bat in the nutz... (\\.\ Aug08)
    I want to leave this world the same way I came into it, Screaming, Incontinent & No memory!
    I laughed that hard I burst my colostomy bag... (\\.\ May03)
    Life for some is like a car accident... Mine is like a motorway pile up...

    Problems with Vista? :: Getting Cryptic wid it. :: The 'C' word! :: Whois?

  6. #6
    Join Date
    Jun 2008
    Posts
    106
    Did you try my example? It works perfectly in Firefox.

  7. #7
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    2,360
    Tried in FF and Chrome. No Joy.

    I have found something that I am going to try.
    Yes, I know I'm about as subtle as being hit by a bus..(\\.\ Aug08)
    Yep... I say it like I see it, even if it is like a baseball bat in the nutz... (\\.\ Aug08)
    I want to leave this world the same way I came into it, Screaming, Incontinent & No memory!
    I laughed that hard I burst my colostomy bag... (\\.\ May03)
    Life for some is like a car accident... Mine is like a motorway pile up...

    Problems with Vista? :: Getting Cryptic wid it. :: The 'C' word! :: Whois?

  8. #8
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    2,360
    Having looked at Quirksmode, comparability with the events I have been trying to use, it appears that onkeydown is supported across the selection of browsers but onkeypress isn't although this does not in itself account for why the browsers I have tried ignore the attempt to capture and suppress the default action of backspace.
    Yes, I know I'm about as subtle as being hit by a bus..(\\.\ Aug08)
    Yep... I say it like I see it, even if it is like a baseball bat in the nutz... (\\.\ Aug08)
    I want to leave this world the same way I came into it, Screaming, Incontinent & No memory!
    I laughed that hard I burst my colostomy bag... (\\.\ May03)
    Life for some is like a car accident... Mine is like a motorway pile up...

    Problems with Vista? :: Getting Cryptic wid it. :: The 'C' word! :: Whois?

  9. #9
    Join Date
    Mar 2009
    Posts
    501
    I am still not entirely sure I know what you are trying to do, but have you tried something like this:

    Code:
    el.onkeydown = function(e){
        var code, ch,;
        if (!e){
    	var e = window.event;
        }
        if (e.keyCode){
    	code = e.keyCode;
        }
        else if (e.which){
    	code = e.which;
        }
        ch = String.fromCharCode(code);
        if(ch === "\b"){
    	e.returnValue = false;  //this is the key
        }
        //whatever it is you want it to do if its not a backspace
    }

  10. #10
    Join Date
    Mar 2007
    Location
    localhost
    Posts
    2,360
    I found this code
    Code:
    	function suppressBackspace(evt) {
        evt = evt || window.event;
        var target = evt.target || evt.srcElement;
    
        if (evt.keyCode == 8 && !/input|textarea/i.test(target.nodeName)) {
            return false;
        }
    }
    
    document.onkeydown = suppressBackspace;
    document.onkeypress = suppressBackspace;
    which is working in Chrome, Firefox and MSIE.
    Yes, I know I'm about as subtle as being hit by a bus..(\\.\ Aug08)
    Yep... I say it like I see it, even if it is like a baseball bat in the nutz... (\\.\ Aug08)
    I want to leave this world the same way I came into it, Screaming, Incontinent & No memory!
    I laughed that hard I burst my colostomy bag... (\\.\ May03)
    Life for some is like a car accident... Mine is like a motorway pile up...

    Problems with Vista? :: Getting Cryptic wid it. :: The 'C' word! :: Whois?

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles