How to combine keypress and onclick function Javascript? [duplicate]

Question

I have the following two functions:

$("input").keypress(function(event) {
    if (event.which == 13) {
       //code        
    }       
});
$('#login_submit').click(function () {        
       //code                    
});

The code which is being used in the functions are EXACTLY the same code, basically code duplication. So i was wondering if there is a way to combine these functions with an AND statement?? There is an question on Stack but it aks for an OR logic. If you want the OR solution here

EDIT: I am trying to make somthing like an explorer. Now I want to hold "shift" and click on an "input" to mark them all. So i need the "onclick" on my input element to be true AND my keydown to be true.

Just put the bulk of the code in a function and call that function - keeping the handlers separate will make it easier to read. — tymeJV
– tymeJV, Commented Jul 24, 2017 at 15:04
What do you even mean by “combining with an AND” here ...? Do you want the handler function to only be executed if the user presses enter and clicks the submit button at the same time …? (That sounds like a nice way to eff up a UI, if you ask me.) If that’s not it, but just just want to have the same function handle both events, occurring independent of each other - well then what are you asking, that’s be answered in the other question already ...? — C3roe
– C3roe, Commented Jul 24, 2017 at 15:06
Thanks for clarifying (edit to question). You can use the event object (api.jquery.com/category/events/event-object) to see which keys are pressed. You won't be able to do this with keypress, but you could with keydown/keyup: Looks like this is what you are after: stackoverflow.com/a/43141764/2181514 — fdomn-m
– fdomn-m, Commented Jul 24, 2017 at 15:19

CumminUp07 · Accepted Answer · 2017-07-24 15:47:26Z

4

After your edit, I believe what you are looking for is something like the following.

var shift_hold = false;
$(document).keydown(function(e) {
    if(e.which === 16) {
        shift_hold = true;
    }
})

$(document).keyup(function(e) {
    if(e.which === 16) {
        shift_hold = false();
    }
})

$('input').click(function() {
    if(shift_hold) {
        //your code here
    }
})

edited Jul 24, 2017 at 15:47

answered Jul 24, 2017 at 15:05

CumminUp07

1,9781 gold badge11 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Sumner Evans Over a year ago

This doesn't check the keypress keycode.

rob Over a year ago

This question answers the question specified by the title exactly. I don't see a reason for the downvote. The OP has clearly demonstrated knowledge of targeting and key events, this is all the OP needs to complete his task as asked by the question.

fdomn-m Over a year ago

Without additional information, it's not clear what the OP wants as they've already provided a link to a "valid" answer (ie the same as this answer!) within the question itself.

Erdnuss Over a year ago

Not what I asked for. But anyway thank :)

CumminUp07 Over a year ago

@Erdnuss I edited my answer after your clarification

fdomn-m · Accepted Answer · 2017-07-24 15:48:02Z

I want to hold "shift" and click on an "input" to mark them all. So I need the "onclick" on my input element to be true AND my keydown to be true.

Within the click event, you can check if a key is also pressed down (click and key-is-down).

You can use the event object to see which keys are pressed. shift/control/alt have their own explicit properties.

Example:

$("input").click(function() {
  console.log(event.shiftKey)
  if (event.shiftKey) {
    $(this).addClass("selected")
  } else {
    $(this).removeClass("selected")
  }
  // could use .toggleClass("selected", event.shiftKey) here,
  // shown expanded for clarity
});

.selected {
  border: 1px solid red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Shift-click input to select, click to unselect
<input type='text'>
<input type='text'>

Collectives™ on Stack Overflow

How to combine keypress and onclick function Javascript? [duplicate]

2 Answers 2

5 Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Linked

Related