jQuery KeyUp and Click

Question

I was wondering how you can do .keyup() and .click() for the same #id?

i.e. essentially I want to validate the #id when both the user attempts to hit enter or hits the #search button.

Thanks alot

score 24 · Accepted Answer · answered May 03 '11 at 14:41

24

$('#foo').bind('click keyup', function(event) {
  ...

You'll have to add some logic, as the event type changes, but it should work with enough if blocks.

answered May 03 '11 at 14:41

Blender

289,723
53
439
496

I initially thought this too, but it doesn't look like the OP really wants to bind multiple events to a DOM object, but instead have multiple events on multiple objects invoke the same code. – justkt May 03 '11 at 14:43
Ah, that seems right. @Neal's answer is more appropriate then. – Blender May 03 '11 at 14:45
hi - yeah thanks a lot. the aim is to invoke multiple events on multiple objects ? – Tom May 03 '11 at 14:45
2

If it's the same event, you can add multiple objects to the selector: `$('#foo, #bar, #baz').bind('click keyup mouseover'), function(...` – Blender May 03 '11 at 14:49

score 3 · Answer 2 · answered May 03 '11 at 14:40

Well you can do:

        $(document).keydown(function(objEvent) {
            if (objEvent.keyCode == 13) {  //clicked enter
                 $('#search').click(); //do click
            }
        })

        $("#search").click(function(e){/*click fn*/})

Will run the click on enter press

score 2 · Answer 3 · answered May 03 '11 at 14:42

2

$("#id").click(validate).keyup(function(event)
{
    if (event.keyCode == '13') validate();
});
function validate() { ... validate $(this).val(); ... }

answered May 03 '11 at 14:42

Mo Valipour

13,286
12
61
87

score 2 · Answer 4 · edited May 20 '16 at 15:23

2

I'd go for something like this:

function validate(element) {
     // your validation stuff goes here
}

$('#id').keyup(function(event) {
    if (event.keyCode == 13) {  
        validate(this);
    }
}).click(function() {
    validate(this);
});

edited May 20 '16 at 15:23

Michał Perłakowski

88,409
26
156
177

answered May 03 '11 at 14:42

Aron Rotteveel

81,193
17
104
128

score 1 · Answer 5 · answered Apr 19 '13 at 15:44

1

The new jQuery offers the which property on the event to check which key was pressed so yo can do something like this now:

$(#id").on('keyup',function(e){
    if (e.which==13 || e.which==9) doSomething(this); //Enter or Tab key
});

answered Apr 19 '13 at 15:44

fidoogle

91
3

score 0 · Answer 6 · answered Sep 15 '20 at 05:15

0

function checkEnter(event) { if (event.keyCode === 13) {

            if (!(date_regex.test(event.target.value))) {
                event.target.value = '';
            }
        }
    }

answered Sep 15 '20 at 05:15

Rhushikesh Baradkar

261
2
3

Please explain how this solves problem. See [How To Answer](https://stackoverflow.com/help/how-to-answer) – jasie Sep 15 '20 at 06:09

jQuery KeyUp and Click

6 Answers6