Question

I tried to use this for a simple hotkey function, that reacts to keypress for some keys, but doesn’t if your editing in the box with the given ID. Unfortunately now Hotkeys are disabled always. I get the alert() all the time 🙁

the textfield is on e.g. http://tyrant.40in.net/kg/news.php?id=160#comments

Inside the text area it works but my script does not recognize, whether I’m inside the text area or outside (it also doesn’t help to click in textarea and click outside).

Please help me.

I also tried to do it another way by selecting (!$(‘#tfta_1 #search’)) instead of $(‘html’), so that the hotkeys do not work wenn you are in of of these IDs. Unfortunately this did not work ether.

edit: the js also has tocheck if crtl, alt, shift to avoid interpret

// Hotkeys (listen to keyboard input)
$('html').keypress(
    function(event){

        // is cursor at the beginning / end of edit box
        var textInput = document.getElementById("tfta_1"), val = textInput.value;
        var isAtStart = false, isAtEnd = false;
        if (typeof textInput.selectionStart == "number") {
            // Non-IE browsers
            isAtStart = (textInput.selectionStart == 0);
            isAtEnd = (textInput.selectionEnd == val.length);
        } else if (document.selection && document.selection.createRange) {
            // IE branch
            textInput.focus();
            var selRange = document.selection.createRange();
            var inputRange = textInput.createTextRange();
            var inputSelRange = inputRange.duplicate();
            inputSelRange.moveToBookmark(selRange.getBookmark());
            isAtStart = inputSelRange.compareEndPoints("StartToStart", inputRange) == 0;
            isAtEnd = inputSelRange.compareEndPoints("EndToEnd", inputRange) == 0;
            }
        // combine information -> is cursor in edit box?
        var eb = isAtStart + isAtEnd;
        // if in comment box
        if ( eb ) {
            // do nothing
            alert('You are in the comment box');
        }
        // if key 'p' is pressed
        else if (event.which == 112){
            // open profile page
            window.location = home + 'profile.php';
        }
        // if key 'q' is pressed
        else if (event.which == 113){
            // open quests overview
            window.location = home + 'quests.php';
        }
        // if key 'r' is pressed
        else if (event.which == 114){
            // open raids overview
            window.location = home + 'raids.php';
        }
        // if key 'f' is pressed
        else if (event.which == 102){
            // open fraction tracker
            window.location = home + 'factiontracker.php';
        }       
    }
);

Answer 1

You need to check the event.target property.

if ('textarea' == event.target.tagName.toLowerCase()) {
    return;
}

Or:

if ($(event.target).is('textarea')) {
    return;
}

As for the modifier keys, see event.shiftKey, event.ctrlKey and event.altKey.