How to disable keyboard events in javascript input text box

Question

I have an image, and I use keyboards to apply some manipulations to it (translation, scaling ..). Above the image, I have an input text box that shows the image number in the data set. How to disable image manipulation when the cursor is in a text field? (i.e. disable the behavior that I assigned to each keyboard). I would also like to still edit the text box (e.g. to go to xx image number). From what I read here iPad Disable keyevent on input , I think the solution would be something like this:

// input text field var currentPosDisplay = $('<input type=text id="currentPos" onkeypress="return disableManipulation();" value="1" style="display:inline" >'); 

But I do not know how to implement disableManipulation (), so that when you click on the keyboard (inside the text field), only the default behavior (and not image manipulation) occurs

Answer 1

It looks like you want the user to change the value in input , but you do not want these events to appear at the document level (or some other container) where you connected the event keyboard for image manipulation.

If this happens, you can do this with Event#stopPropagation :

 var currentPosDisplay = $('<input type=text id="currentPos" value="1" style="display:inline" >'); currentPosDisplay.on("keypress keydown keyup", function(e) { e.stopPropagation(); }); 

Answer 2

You can check if the input element has focus: How do I know which DOM element has focus?

And if so, do not use image manipulation.

Returning false from the onkeypress handler will ignore the key pressed, but if you have focus, it sounds like you don't want it.