How to disable TAB key in Mozilla Firefox?

Question

How to disable TAB key in Mozilla Firefox?

2.7k Views Asked by user1122910 At 21 October 2024 at 02:22

I want to disable the tab key in my HTML form. I found following JavaScript code to disable tab, but it doesn't work in Firefox (working in Chrome and IE).

<script type="text/javascript">
document.onkeydown = function () {
    if (window.event && window.event.keyCode == 9) { // Capture and remap TAB
        window.event.keyCode = 9;
    }
    if (window.event && window.event.keyCode == 9) { // New action for TAB
        alert('The TAB key was pressed');
        return false;
    }
}    
</script>

This is my HTML form:

<body>
    <form>
        <input type='text'><br>
        <input type='text'><br>
        <input type='text'><br>
        <input type='text'><br>
        <input type='text'><br>
        <input type='text'><br>
        <input type='text'><br>
        <input type='submit'><input type='reset'>
    </form>
</body>

Original Q&A

There are 2 best solutions below

nikc.org On 24 January 2012 at 08:41

I've dabbled in allowing the tab key to be used in textareas, perhaps you can derive further from this.

<form>
    <textarea rows="15" cols="82"></textarea>
</form>

<script>
function initTabinput() {
    window.addEventListener('keydown', tabListener.bind(area), false);
}

var area = document.getElementsByTagName('textarea')[0];
var tabListener = function (evt) {
    if ('keyCode' in evt && evt.keyCode === 9) {
        evt.preventDefault();

        var caretPos = this.selectionStart;
        var beforeCursor = this.value.substring(0, caretPos);
        var afterCursor = this.value.substring(caretPos);

        caretPos += 1;

        this.value = beforeCursor + "\t" + afterCursor;
        this.setSelectionRange(caretPos, caretPos);
    }
};

window.addEventListener('load', initTabinput, false);
</script>

NB. This is absolutely not cross-browser compatible code and has been tested only in recent versions of Chrome.

**Havvy** · Accepted Answer

event.stopPropogation() or event.cancelBubble() (for certain version of IE) will stop an event from propagating upwards, including the default handler.

As others have said, it's a bad idea to be preventing tab from working properly. From a user's point of view, disabling tab is likely to become very irritating.

How to disable TAB key in Mozilla Firefox?

There are 2 best solutions below

Related Questions in JAVASCRIPT

Related Questions in HTML

Related Questions in DOM-EVENTS

Related Questions in EVENT-PROPAGATION

Trending Questions

Popular # Hahtags

Popular Questions