JQuery Event for user pressing enter in a textbox

Question

Is there any event in Jquery that s triggered only if the user hits the enter button in a textbox  Or any plugin that can be added to include this  If not  how would I write a quick plugin that would do this

User · Answer

HTML Code -   lt input type  text  name  txt1  id  txt1  onkeypress  return AddKeyPress event      gt          lt input type  button  id  btnclick  gt    Java Script Code  function AddKeyPress e                look for window event in case event isn t passed in         e   e    window event          if  e keyCode    13                document getElementById  btnEmail   click                return false                    return true          Your Form do not have Default Submit Button

User · Answer

heres a jquery plugin to do that   function            fn onEnter   function func            this bind  keypress   function e                if  e keyCode    13  func apply this   e                                           return this              jQuery     to use it  include the code and set it up like this      function          console log    input            input   onEnter  function               this  val  Enter key pressed                                  jsfiddle of it here http   jsfiddle net VrwgP 30

User · Answer

Here is a plugin for you   Fiddle  http   jsfiddle net maniator CjrJ7      fn pressEnter   function fn           return this each function                 this  bind  enterPress   fn             this  keyup function e               if e keyCode    13                                this  trigger  enterPress                                               use it     textarea   pressEnter function   alert  here

User · Answer

You can wire up your own custom event      textarea   bind  enterKey  function e        do stuff here        textarea   keyup function e       if e keyCode    13                  this  trigger  enterKey                http   jsfiddle net x7HVQ

User · Answer

It should be well noted that the use of live   in jQuery has been deprecated since version 1 7 and has been removed in jQuery 1 9  Instead  the use of on   is recommended   I would highly suggest the following methodology for binding  as it solves the following potential challenges    By binding the event onto document body and passing  selector as the second argument to on    elements can be attached  detached  added or removed from the DOM without needing to deal with re-binding or double-binding events  This is because the event is attached to document body rather than  selector directly  which means  selector can be added  removed and added again and will never load the event bound to it  By calling off   before on    this script can live either within within the main  body of the page  or within the body of an AJAX call  without having to worry about accidentally double-binding events  By wrapping the script within   function           this script can again be loaded by either the main body of the page  or within the body of an AJAX call    document  ready   does not get fired for AJAX requests  while   function          does    Here is an example    lt  DOCTYPE html gt     lt head gt       lt script src    ajax googleapis com ajax libs jquery 1 10 2 jquery min js  gt  lt  script gt       lt script type  text javascript  gt          function             var  selector      textarea                Prevent double-binding             only a potential issue if script is loaded through AJAX            document body  off  keyup    selector               Bind to keyup events on the  selector            document body  on  keyup    selector  function event              if event keyCode    13       13   Enter Key             alert  enter key pressed                                            lt  script gt     lt  head gt     lt body gt      lt  body gt   lt  html gt

User · Answer

Another subtle variation  I went for a slight separation of powers  so I have a plugin to enable catching the enter key  then I just bind to events normally    function        fn catchEnter   function sel          return this each function                this  on  keyup  sel function e               if e keyCode    13                  this  trigger  enterkey                               jQuery     And then in use       input type  text     catchEnter   on  enterkey  function ev          This variation allows you to use event delegation  to bind to elements you haven t created yet       body   catchEnter   onelineInput   on  enterkey  function ev      process input

User · Answer

textbox   on  keypress   function  e             if e which     13                  Disable textbox to prevent multiple submit               this  attr  disabled    disabled                   Do Stuff  submit  etc                  Enable the textbox again if needed                this  removeAttr  disabled

User · Answer

I could not get the keypress event to fire for the enter button  and scratched my head for some time  until I read the jQuery docs     The keypress event is sent to an element when the browser registers keyboard input  This is similar to the keydown event  except that modifier and non-printing keys such as Shift  Esc  and delete trigger keydown events but not keypress events    https   api jquery com keypress    I had to use the keyup or keydown event to catch a press of the enter button

User · Answer

If your input is search  you also can use on  search  event  Example   lt input type  search  placeholder  Search  id  searchTextBox  gt           searchPostTextBox   on  search   function          alert  search value      this  val

[javascript] JQuery Event for user pressing enter in a textbox?

Examples related to javascript

Examples related to jquery

Examples related to jquery-events