How to catch enter keypress on textarea but not shift+enter?

Question

I'm doing it for texarea. A function should be called when the user press Enter, but nothing should be done when Shift + Enter be pressed.

I try to simulate here a feature that many IM communicators have: sending a message on Enter but also adding multiple lines using Shift + Enter.

I must ask - why you try not to? It today's world of compatibility, how are you accounting for each browser? Unless it's performance you're worried about, to which I guess you could pick and choose.. — Stuart.Sklinar, Jan 25 '13 at 09:45
@Stuart.Sklinar For example when developing Opera plugin using jquery means problems. — rsk82, Jan 25 '13 at 12:20
Ah, if it's for pluggin dev, it would make perfect sense to use Vanilla JS! — Stuart.Sklinar, Jan 28 '13 at 13:03

aorcsik · Accepted Answer · 2018-01-12T12:42:07.877

43

Test for the enter keycode (13) and if shift key was pressed.

...onkeyup = function(e) {
    if (e.keyCode == 13)
    {
//      if (e.shiftKey === true)
        if (e.shiftKey)  // thruthy
        {
            // new line
        }
        else
        {
            // run your function
        }
        return false;
    }
}

Edit: Accept all truthy values of e.shiftKey

edited Jan 12 '18 at 12:42

answered May 30 '11 at 16:09

aorcsik

14,571
4
38
49

1

Sorry if this is a stupid question, but why do you return false at the end of the if? – Nass Sep 10 '13 at 12:58
3

@Salmonface in browser event listeners, if you return false in the callback you prevent the default action. Hitting `enter` in a form with a submit button sends the form by default, but if you return false, it won't be sent. Note: you have to use `keydown` event to be able to prevent default key actions. – aorcsik Sep 11 '13 at 06:07
Ah I see! Thanks @aorcsik – Nass Nov 20 '13 at 18:16
I had to use "==" instead of "===" – Morvader Dec 16 '15 at 16:17
1

What's wrong with just `if (e.shiftKey)`? It's a boolean property. – Stefan Reich Dec 05 '17 at 15:14
@StefanReich it's probably good that way as well. – aorcsik Jan 12 '18 at 12:39
Is anybody tried in Safari? – Hyzyr Jan 17 '22 at 18:49

ic3b3rg · Answer 2 · 2018-12-03T18:16:05.490

2

element.onkeydown = function(o) {
  o = o || event;
  if (o.shiftKey && o.keyCode == 13) {
    /* shift + enter pressed */
  }
}

edited Dec 03 '18 at 18:16

answered May 30 '11 at 16:11

ic3b3rg

14,063
4
25
49

Why are you not using propper formatting for better readability? – Stophface Dec 03 '18 at 12:36
@Stophface - Not sure why I formatted the way I did - it's a very old answer. Thanks for the suggestion! – ic3b3rg Dec 03 '18 at 18:20

score 1 · Answer 3 · answered May 30 '11 at 16:07

1

I believe you need a keydown event as well to check for the SHIFT key, http://www.quirksmode.org/js/keys.html

answered May 30 '11 at 16:07

nickytonline

6,805
6
41
75

score 0 · Answer 4 · answered May 30 '11 at 16:09

0

Look at the shiftKey property of the event object which will tell you if shift was held while the key was pressed.

answered May 30 '11 at 16:09

ADW

4,010
16
13

How to catch enter keypress on textarea but not shift+enter?

4 Answers4

Linked

Related