title: jquery - disabling click function on parent element
body: <p>i have structure like this</p>
  
  <pre><code>&lt;table&gt;&lt;tr&gt;&lt;td&gt;&lt;/td&gt;&lt;td&gt;&lt;input type="button" name="button"&gt;&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;
  &lt;script&gt; 
  $('tr').click(function(){window.alert('tr');})
  $(':input').click(function(){window.alert('input');})
  &lt;/script&gt;
  </code></pre>
  
  <p>when i click on the button, tr click event also called. is there any way to disable click event on parent element? the only solution i found is to add class to parent element and inside its click function check for it.
   for example:</p>
  
  <pre><code> &lt;script&gt; 
  $('tr').click(function(){ if(!$(this).hasClass('disable')) { window.alert('tr');  }  $(this).removeClass('disable');  })
  $(':input').click(function(){window.alert('input'); $(this).closest('tr').addClass('disable');})
  &lt;/script&gt;
  </code></pre>