Get the element triggering an onclick event in jquery

Question

I have a form where i ve replaced the submit button with an input  with type button  with an onclick which calls an existing function    lt form accept-charset  UTF-8  action   admin message campaigns  class  new message campaign  id  new message campaign  method  post  gt     lt  -- some fields -- gt         lt input onclick  confirmSubmit     type  button  value  Send    gt   lt  form gt    In the confirmSubmit  i d like to be able to dynamically get the form object  to submit it   instead of having to hardcode the form s id  or pass it as part of the call to confirmSubmit     I d have thought that i could do this by first getting the dom element that was clicked on  ie something like this   var form     this  parents  form      where   this  is the object that called the function  ie the input with the onclick   This doesn t work though   I think it would work if i d set it up with the  click function    syntax   Can i get the element that called the function in a different way   EDIT - got the answer from  claudio below  for clarity here s the complete function and call    lt form accept-charset  UTF-8  action   admin message campaigns  class  new message campaign  id  new message campaign  method  post  gt     lt  -- some fields -- gt         lt input onclick  confirmSubmit   this     type  button  value  Send    gt   lt  form gt    and the function itself   Note that  jConfirm  is a method of the jquery-alerts plugin  http   abeautifulsite net blog 2008 12 jquery-alert-dialogs   but that s not really relevant to this question - the key thing was just to get the form object  not what s subsequently done with it   function confirmSubmit caller      var form   caller parents  form      jConfirm  Are you sure     Please Confirm   function result       if  result          form submit          else         return false

User · Answer

It s top google stackoverflow question  but all answers are not jQuery related       someclass   click      function event                console log event  this               event  contains 2 important values   event currentTarget - element to which event is triggered    someclass  element   event target - element clicked  in case when inside   someclass   div  are other elements and you clicked on of them   this - is set to triggered element    someclass    but it s JavaScript element  not jQuery element  so if you want to use some jQuery function on it  you must first change it to jQuery element    this   When your refresh the page and reload the scripts again  this method not work  You have to use jquery  unbind  method

User · Answer

You can pass the inline handler the this keyword  obtaining the element which fired the event    like    onclick  confirmSubmit this

User · Answer

If you don t want to pass the clicked on element to the function through a parameter  then you need to access the event object that is happening  and get the target from that object  This is most easily done if you bind the click event like this       sendButton   click function e       var SendButton     e target       var TheForm   SendButton parents  form        TheForm submit         return false

User · Answer

Try this   lt input onclick  confirmSubmit event    type  button  value  Send    gt    Along with this  function confirmSubmit event               var domElement    event target               console log domElement attr  type                 I tried it in firefox  it prints the  type  attribute of dom Element clicked  I guess you can then get the form via the parents   methods using this object

[javascript] Get the element triggering an onclick event in jquery?

Examples related to javascript

Examples related to jquery